stylish.. 웹사이트를 맘대로 출력하자.

Firefox 확장 기능(Extensions)에 대한 정보 및 질문과 답변을 하는 게시판입니다. update.mozilla.or.kr 를 참고하세요
Post Reply
피곤해
Posts: 21
Joined: 2006 02 02 06:54 58
Contact:

stylish.. 웹사이트를 맘대로 출력하자.

Post by 피곤해 »

파폭을 사용하면서.. 브라우저상에 보이는 어딘지 모르는 투박감이라고 해야 하나요?
국내는 파폭의 버전업으로 많이 좋아졌지만.. 외국 사이트를 가는 경우에 역시 국내랑 틀린 페이지 구성및 스타일 시트등으로 보기에 안 좋아서 좀 그랬습니다.
(물론 이 것은 익스도 마찬가지지만..)

얼마전 stylish라는 확장기능을 알고.. 적용하니 너무 좋더군요..
전 갠적으로 verdana 9pt 의 글씨체를 좋아합니다.
이 확장기능을 설치하면 해당 웹페이지를 자신이 원하는 스타일로 페이지를 구성할수 있습니다.
심지어 광고나 보고 싶지 않은 내용은 출력을 하지 않을수도 있고요..

우선 stylish를 설치합니다.
https://addons.mozilla.org/firefox/2108/

그리고 ctrl+M을 클릭하면 Manage styles 창이 뜨게 됩니다.
write를 클릭해 해당 창에 원하는 스타일을 적어주면 특정 사이트, 특정 페이지를 원하는 형태로 보실수 있습니다.
간단히 제가 사용하는 스타일을 몇개 적어 봅니다.

@namespace url(http://www.w3.org/1999/xhtml);

/* google.co.kr 과 google.com 페이지 제어*/
@-moz-document domain(google.co.kr), domain(google.com)
{

/* applies font to all generic HTML tags */
html, body, span, div, td, br, input, font, button {
font-family: Verdana !important;
font-size: 9pt !important;
}

/* specifies width of web search results column */
td.j {
width: 50% !important;
}
}

/* gmail에서 메일 보는 페이지 */
@-moz-document domain(mail.google.com)
{
/* applies font to all generic HTML tags */
html, body, div, td, br, span, input, font, button {
font-family: Verdana !important;
font-size: 9pt !important;
}

span.ct{
font-family:Tahoma !important;
font-size:8pt !important;
color:#CC0000 !important;
}

/* ads remove */
div[class^=rh] {display: none !important;}
div[id=ap] {display: none !important;}
div[class=msg] {width: 765px !important;}

span[class=q] {display: none !important;}

/* corrects navigation column width in gmail */
#nav {
width: 150px !important;
}
#co {
margin-left: 150px !important;
}
}

/* google 뉴스그룹*/
@-moz-document domain(groups.google.co.kr)
{
/* applies font to all generic HTML tags */
html, body, div, td, br, input, font, button {
font-family: Verdana !important;
font-size: 9pt !important;
}

/* ads remove */
div[class^=rh] {display: none !important;}
div[id=ap] {display: none !important;}
div[class=msg] {width: 765px !important;}

a:link, a:active, a:visited {text-decoration:none;}
a:hover {text-decoration:underline;}
}

/* 구글의 개인화 홈페이지 */
@-moz-document url(http://www.google.co.kr/ig?hl=ko) {
html, body, span, div, td, br, input, font, button, a {
font-family: Tahoma !important;
font-size: 9pt !important;
}

a:link, a:active, a:visited {color:black;text-decoration:none;}
a:hover {color:blue;text-decoration:underline;}

.mc {line-height:100%}
}


그리고 파폭의 기본 구성을 변경하려면..
새롭게 write를 클릭하고.. 또 하나를 작성합니다.

@namespace url(http://www.w3.org/1999/xhtml);
body, td, textarea, input, select, pre, div
{
font-family:verdana, 굴림, seoul, gulim; font-size:9pt; letter-spacing:0px; color:black;
}

그냥 스타일시트로 작성해 두었는데.. 적용을 하더군요.
참조하세요.
피곤해
Posts: 21
Joined: 2006 02 02 06:54 58
Contact:

Post by 피곤해 »

다른 사용자가 작성한 스타일을 보려면 아래 링크를 참조해 구성하시면 됩니다.
http://userstyles.org/style/list/site
Post Reply

Who is online

Users browsing this forum: No registered users and 1 guest