태터툴즈 본문 이미지에 점선 없애기
Posted 2007/04/01 22:57, Filed under: TattertoolsLifepod 개발블로그를 방문해 보니 보시는 것 처럼 본문의 이미지 하단 부분에 파란색 점선이 있더군요. 예전에 제가 배포한 초창기의 스킨에서도 이와 같은 모습이 있었습니다.
Lifepod 에서는 이 점선을 의도한 것 일 수도 있으나 그때 당시 저는 원치 않은 결과 중에 한 부분이었기 때문에 저런 모습이 눈에 자꾸 걸린답니다. 일종의 노이로제가 증상인가 봐요..
일단, 저 점선의 정체는 본문의 a element 에 dashed 값을 지닌 border 속성 입니다.
(보통 하이퍼링크를 식별자로 text-decoration:underline 를 사용하지만 선 모양, 두깨, 색상, 간격과 같은 설정을 지정하기 위해 border를 사용하기도 합니다.)
이 속성은 본문의 이미지에도 상속이 되기 때문에 하이퍼 링크가 걸리는 이미지에도 border 값이 나타나게 되는 것 이죠.
.article a:link, .article a:visited {
color:#0066CC;
border-bottom: 1px dashed;
}Lifepod 개발블로그의 CSS에는 위 처럼 본문의 A 엘리먼트 에 border 프로퍼티를 사용 하고 있는것을 확인 할 수 있는데, 이것을 없애기 위해선 다음과 같은 항목을 CSS에 추가해 주시면 됩니다.
.imageblock * {
border:none !important;
}태터툴즈의 본문에 삽입되는 이미지는 class="imageblock" 이라는 div로 감싸지게 되고 있기 때문에 .imageblock 이후의 모든 값에 border 값을 없앤다는 의미 입니다.
블로고스피어에서 놀다보면 가끔씩 저런 점선이 있는 블로그들이 종종 보이고 있는데, 그 중에서 혹시라도 이미지에 점선을 없애고 싶은 분이 계시다면 한번 적용해 보시기 바랍니다.
Trackback URL : http://1upz.com/trackback/64
-
전 오히려 저렇게 밑줄로 나오는게.. 의외로 괜찮던데요~ :D
의외로 어울리는.. 이미지들도 있어서.. 후후~!-
가끔 어울리는 경우도 있지만 어색하게 느껴지는 경우도 많기 때문에 원치 않은 사람들이 있을거에요...있겠죠. 있었으면...-_-;;
-
-
저도 초기에 저 이미지 아래 생기는 점선 때문에 신경이 쓰여서 없애는 방법을 막 찾아다니고, 제작자님께 묻고 그랬었지요. 저만 그런 게 아니었군효;
-
lyzche님 같은 분을 원해요 -o-)/
-
-
비밀댓글 입니다
-
일반적으로 티스토리 에디터에서 입력한 글이 아닌것 같습니다. imageblock 이 아닌 테이블 테그로 감싸져 있어 스타일이 적용되지 않는 상황 이네요..
.imageblock * 이 부분을 .imageblock *, .article table * 이렇게 고쳐서 사용하시거나(단, 태이블 내의 모든 링크에 밑줄이 없어집니다.
.nobdr {border: 0 none;}
이라는 스타일을 새로 만드신 다음 해당 글 수정- html 모드 에 들어가셔서 점선이 나타나는 이미지의 상위 앨리먼트(a) 에 class="nobdr" 이라는 클래스를 지정해 주면 됩니다.. 만 번거롭네요 --; -
테이블 때문이었군요. ^^
말씀해주신 첫 번째 팁을 적용하겠습니다.
말씀 고맙습니다. (__)
-
-
비밀댓글 입니다
-
님 블로그에가서 확인해 보려 했는데, 링크가 걸려있는 이미지를 찾을 수가 없네요;; 40페이지정도 까지 휙휙 넘겨보다 풀썩..
-
-
비밀댓글 입니다
-
고민했었는데
뜻밖의 검색으로 좋은 정보 얻었네요.
감사합니다. ^^
그리고 한가지 궁금한 게 있습니다.
이미지갤러리를 삽입하면 '이전·이후 이미지보기버튼' 등에도 밑줄이 있는데 이것도 해결할 수 있나요?
주소 링크 설정했습니다.
http://buri.kr/30-
.galleryControl a {border:0 none !important;}
를 한번 추가 해 보세요.. -
속시원하게 해결되었네요~ ^^
정말 감사합니다.
-
-
비밀댓글 입니다
-
비밀댓글 입니다