메인메뉴| 블로그프로필| 소셜| 사이트| 리뷰포스팅| 추천포스팅| 메타사이트| 포스트 낙서장| [방명록]| [RSS]

홈으로| 프로필| 위치| 태그| 미디어| 영화| 여행| 나이스팁| 방명록| 블로그 RSS 주소 : [http://feeds2.feedburner.com/jaea] 블로그명 : JAEA@BLOG|필명 : 재아| 블로그 RSS 주소 : [http://feeds2.feedburner.com/jaea]| 재아넷 트위터| 재아넷(kr) 트위터| yozm| 재아넷 톡픽| 재아넷 미투데이| 재아 토트| 재아넷 아프리카 방송| 재아넷 팟플레이어 방송| kr.dnsever.com| 바이블로그| 블로드| 링크프라이스| 용의자| 포샵질닷컴| 톡톡샘| dryicons| fordesigner| free icon sets 40| 윈도우포럼| 리뷰| 웹서비스| 샬록홈즈| 다음카페관리| 티스토리 베타테스트| 새싹키우기| 얼리어답터 블로그의 블로거를 위한 블로거의 팁| 인터넷을 좀더 편하게| 컴퓨터를 보다 재미있게| 티스토리 키워드 기능을 사용해보세요!| 재아의 포스팅 방법 공개 티스토리| 올블로그| 블로그코리아| 온타운| 한RSS| 프레스블로그| 위자드웍스| 블로그플러스| 바이럴블로그| 다음뷰| 레뷰 포스트잇등을 이용하여 멋진 낙서장을 준비했습니다. 여러분도 한번 이용해보세요!! 클릭 |낙서장을 다는법에 대해서 소개합니다,

방명록입니다. 여러분의 소중한 댓글을 기다리고 있어요^^; 언제나 친절하게 ~~ 도와드려요 헤헤

블로그 글을 작성하다보면 필요에 따라 링크를 하게됩니다. 예전에는 기본적으로 링크는 파란색 그리고 링크를 한번이라도 본인이 클릭했다면 약간 자주색으로 변한것을 보았을겁니다. 대부분 파란색은 링크구나 하는 생각이 일반적이었죠!

오늘은 블로그에 글을 작성할때 이렇게 링크되어진 글에 밑줄과 더불어서 원하는 색상으로 표현하는 방법에 대해서 배울겁니다.

어렵지 않으니, 따라 해보세요!

여러분의 스킨에서 STYLE.CSS에서 다음과 같은 검색을 해서 찾습니다
CTRL + F 하시고 아래 단어를 찾으시면 됩니다.

검색을 .article a:link   이걸로 검색하시면 쉽게 찾으실수 있을겁니다.
순서는 약간 틀릴수 있습니다.
/*링크되어진 단어의 색상*/
.article a:link { color:#1E5893; border-bottom: 1px dotted; text-decoration:none;}

/*한번이라도 방문한 링크의 색상*/
.article a:visited { color:#222;  text-decoration:none;}

/*마우스를 갖다 대었을 때 바뀔 색상 */
.article a:hover { color:#666;  text-decoration:underline;}

/*현재 활성화 되어진 링크의 색상*/
.article a:active { color:#222;  text-decoration:none;}
일단 기본적으로 위의 소스는 글 본문에만 적용되는 부분이라 본문을 제외한 다른 사이드바나 하단부분에는 적용이 되지 않습니다.

위에서
.article a:link { color:#1E5893; border-bottom: 1px dotted; text-decoration:none;}

#1E5893;
이 부분은 링크가 걸려진 즉, 본문에서 보여지는 링크가 되어진 단어의 색상을 의미합니다. RED 나 YELLOW 등으로 한다면 링크되어진 색상은 적색이거나, 노랑색이겠죠~ 원하는 색상으로 변경하시면 됩니다.

border-bottom: 1px dotted;
이 부분은 링크가 걸려진 단어 아래에 밑줄을 긋는다는  부분입니다. 간다하게 결과물은 아래에 보시는데로입니다

재아넷

위처럼의 결과물을 얻을수 있습니다. 현재 제 블로그에 적용중입니다.^^

물론, 여러분이 링크에 색상만 주고 밑줄은 필요 없다 하시면  위에서 border-bottom: 1px dotted; 이 부분만 삭제 하면 됩니다.

응용을 한다면 반대로 마우스를 올렸을때 바뀔 색상을 지정한다면 마우스를 링크에 가져가면 원래는 없던, 밑줄이 생긴다거나 색상이 변한다거나 하는식으로 응용을 하셔도 되겠습니다. 원리를 알았으니 이제 응용하러 고고싱^^

그럼 오늘도 즐거운 블로그 생활 합시다!
저작자 표시 비영리 변경 금지
포스팅이 유익하셨다면 추천 부탁드립니다. ^^ 
믹시UP 블로그코리아에 블UP하기 올블로그에 추천하기

Posted by 재아
트랙백 0 댓글 9 MSN 재아넷 블로그를 구독하세요.

댓글을 달아 주세요 "재아넷 블로그에 대한 프로필을 소개합니다."

  1. 저도 오늘 링크를 바꿨습니다.
    스킨 정보와 꼬이는 바람에 많은 삽질이 필요했지만요 ㅠㅜ

  2. 링크색 바꾸고 싶었는뎅~~ 감사합니다 ^^ 헤헤

  3. 본문 링크 색 바꾸고 싶었는데..
    좋은 팁 감사합니다~ ^^
    링크 된 부분에 밑줄은 어떻게 긋는거에용?? ^^;;;;
    특히 점선이 탐나는데 소스를 모르겠어요..ㅠㅠ

  4. 우왓~좋은 팁 알려주셔서 감사합니다~^-^

카테고리

  • 분류 전체보기 (899)
    재아 (256)
    영화 (136)
    나이스팁 (247)
    리뷰 (84)
    강의 (18)
    사진 (15)
    게임 (59)
    알짜 (55)
    재미 (25)
    자료 (2)

스폰서 배너