문서 양식(CSS)를 제어하면 됩니다. CSS를 제어하는 확장기능은 대표적으로 stylish가 있습니다. stylish 확장기능을 설치한 후 해당 CSS를 제어하면 됩니다. 오페라는 브라우저 자체에서 CSS를 제어할 수 있도록 지원합니다. (인터넷 익스플로러도 있는지 해서 찾아보았는데 그런 확장기능이 없네요. 찾으신 분은 알려주시길.)
여기서는 예를들어 구글 리더 글꼴과 줄간격을 변경해 보겠습니다.
파이어폭스·크롬
스타일리시(stylish) 확장기능을 설치합니다.
파이어폭스 https://addons.mozilla.org/ko/firefox/addon/stylish/
크롬 https://chrome.google.com/webstore/detail/fjnbnpbmkenffdnngjfgmeleoegfcffe
설치하고 나면 스타일리시 아이콘이 생깁니다. 파이어폭스는 브라우저 왼쪽 아래에 있습니다.
www.google.com/reader로 갑니다. 아이콘을 누르고 새 스타일 작성 > www.google.com 에 적용을 차례로 클릭합니다.
새로 뜬 작은 새창을 보면 기본 코드가 있고 이름과 태그란은 비어있을 겁니다. .
코드를 수정하겠습니다. 원하는 스타일을 제어해야 하는데 그러기 위해서는 원하는 스타일의 id나 class를 알아야 합니다. id나 class는 여기서 설명하기에는 길어서 생략하고 id나 class는 특정 스타일의 이름이라고 생각하면 됩니다.
해당하는 글의 블록설정한 후 선택한 부분의 소스보기를 누릅니다. 글 본문 있는 곳 앞에 div class="item-body" 가 있는 것을 보아 원하는 곳의 class 이름이 item-body임을 유추할 수 있습니다. (물론 이를 바로 아는 확장기능도 있는데 여기서는 원리만 알려드리는 것이므로 생략하겠습니다.) 크롬은 해당하는 곳에서 오른쪽 클릭 > 요소 검사를 클릭하면 새창이 뜨는데 여기서 알 수 있습니다.
id를 나타내는 기호는 #이고 class를 나타내는 기호는 .입니다. 이건 외워두세요.
@-moz-document domain("www.google.com") 안 괄호{} 에 다음 코드를 넣습니다. 여기서는 나눔고딕, 줄간격 170%로 바꾸어 보겠습니다.
.item-body {
font-family : "나눔고딕";
line-height : 170%;
}
미리보기를 누릅니다. 바뀌었나요? 만일 안 바뀌었다면 강제로 바꾸어라는 명령 !important를 붙여야 합니다.
.item-body {
font-family : "나눔고딕" !important;
line-height : 170% !important;
}
이름에 구글 리더 글꼴 줄간격 변경을 넣습니다. 저장을 누릅니다.
오페라
오페라는 메모장을 열고
.item-body {
font-family : "나눔고딕";
line-height : 170%;
}
를 쓴 후 www.google.com.css로 파일 이름을 주고 구글 리더에 가서 오른쪽 클릭 > 사이트 환경 설정 편집 >내 스타일시트에 www.google.com.css 파일을 지정해 주면 됩니다.
오페라에서 id와 class는 오른쪽 클릭 > 요소 보기를 하면 아래에 별도 창이 뜨는데 여기서 알 수 있습니다
| 번호 | 제목 | 글쓴이 | 날짜 |
|---|---|---|---|
| 공지 | 웹하드 관련 이용팁을 올려주세요! | 따운 | |
| 공지 | 게시판 공통 공지사항 및 유의사항 | 따운 | |
| 1030 | 연말정산- 의료비공제와 교육비공제 | Amen | |
| 1029 | 안드로이드 마켓을 초스피드로 만들기 | Amen | |
| 1028 | 파이어폭스 익스텐션 호환성 체크 통과하기 | Amen | |
| 1027 | 쉽게 읽는 웹 이야기 #2 | Amen | |
| 1026 | 쉽게 읽는 웹 이야기 #1 | Amen | |
| 1025 | KT 복지할인 축소 비교표 | Amen | |
| 1024 | 안드로이드에서 발음기호, emoji 정상 표시 하기 | Amen | |
| 1023 | 연말정산- 주택자금공제와 기부금공제 | Amen | |
| 1022 | KT 뭉치면 올레 변경사항 | Amen | |
| 1021 | 목도리 매는 10가지방법 | 파란영금정 | |
| 1020 | 바다 루어낚시(가짜미끼)로 낚을수 있는 어종은? | 파란영금정 | |
| 1019 | 공유기 사용시 무선 증폭시키기 (안테나 개조) (1) | 파란영금정 | |
| 1018 | 치약의...성능... | 파란영금정 | |
| 1017 | 잠자는 자세과 주름의 관계 | 파란영금정 | |
| 1016 | 구글 크롬북 안부러운 사설 클라우드 컴퓨팅으로 넷북을 빠르게 써보자 | 파란영금정 | |
| 1015 | 이중 지퍼 쉽게 하는법 | 파란영금정 | |
| 1014 | 교수평가, 족보, 수강신청시 도움되는 사이트 | 파란영금정 | |
| 1013 | [컴퓨터팁] 원하는 싸이트 제한걸기 | 파란영금정 | |
| 1012 | NBA가 시작되었습니다. (시청 및 다운법) | 파란영금정 | |
| 1011 | [폰트]출판사 공용 무료서체 코퍼브(KoPub)체 | 파란영금정 | |
| 1010 | 휴대폰분실시 대처법 | 파란영금정 | |
| 1009 | 2012년 새해 달라지는 것들 | 파란영금정 | |
| 1008 | 대학생들을 위한 팁! 스프링노트!! (1) | 파란영금정 | |
| 1007 | 크롬 더 유용하게 쓰기 | 파란영금정 | |
| 1006 | 피자헛 5,000원 할인쿠폰 (1월 31일까지) | 파란영금정 |