웹마스터 팁

  2. Support
  3. 웹마스터 팁

링크관련 ^^

2003.02.13 18:27

K.샘

안냐세염 링크관련 스타일시스란
및줄없애고,한줄로 링크 땡쳐버리는 그런..
일단 태그를 보며 뜻을 이해해 봅쉬다 ^^

<style>
<!--
td { font-family:돋움; font-size:9pt; }//이것을 삽입하면 셀안에 돋움체로 9pt인 글씨가 나옵니다 (셀밖에에는 영향이 않감)
a:link { color:rgb(14,108,167); text-decoration:none; }//링크 첨 왔쓸때임 ^^
a:visited { color:rgb(14,108,167); text-decoration:none; }//이미 들온 싸트일경우^^ 일명 visit뜻이 방문하다라는뜻이니 visited는 방문했다^^("아! 여기까지와서도 영어를배워야한다니 ㅠㅠ"라는 생각마셔여 ㅡㅡ^)
a:active { color:rgb(14,108,167); text-decoration:none; }//마우쓰를 꾸욱 누르고있을때나옵니다.위와같아 별차이가 없는게 기본이다시피
a:hover { color:rgb(14,108,167); text-decoration:underline; }//마우쓰를 위에 올렸을때가 됩니다.
-->
</style>

그리고 뒤져봅쉬다(we가 도둑이냐 ㅡㅡ^)
일단 요기에서
{ color:rgb(14,108,167); text-decoration:underline; }
가있습죠
'color:rgb(14,108,167);"는 색상입니다.
방법은 2가지인데 가령rgb(red,green,blue 즉 빨강,초록,파랑 이라는 뜻 ^^)로나눠서 까문색으로 해봅시다.
'color:rgb(0.0.0);' 저기에서 "(0,0,0)"의 최대값은 "(255,255,255)"입뉘돠 ^^ 틀릴지는 몰라두..-_-;
그리고 2번째방법은
#000000 이런식입니다.
가령 00|00|00 이렇게 3도막으로나눠서 맨 왼쪽은 빨강 중앙은 초록 맨 끝은 파랑 이렇게 나눠서하는데
이건 좀 달라서 최소값은 #000000 최대값은 #ffffff인데 이해가 않가는 분이 많~죠 암암 많고말고
f는 full즉 꽉차다의 맨첫자를 따서 한것입니다 그러니 영어 숫자가 같이 나오는셈이죠..
다만 칸이 2개이니 #f2c4c9이런식으로도 나와서 ㅠㅠ
f2는 반은 꽉차고 반은 2라는 말입니다.
하지만 별로 복잡하지않은것이 숫자는 0~9만 나오고 영어는
c 와 f 밖에없습니다.
하지만 인터넷에서쓸수있는 색과 jpg에서 쓰는 컬러가 다릅니다(인터넷은 256컬러 jpg는 무한-_-;)
그러니 인터넷이나 gif에서 쓸수있는흑백컬러는
#000000,#333333,#666666,#999999,#cccccc,#ffffff
만나오니 잘 조합하면 제로홈피처럼 깔끔한 홈피를 ^^
헉 이거 하나가지고 엄청만이썼다아~그리고 다음은
{ color:rgb(14,108,167); text-decoration:none; }
에서"text-decoration:none;"요거 ^^
끝에
"none"은 속성값을 나타내는겁니다.
그러면 속성값들을 보면
none은 기본 underline은 및줄 overline은윗줄 line-through은 취소선 blink은 깜박임
단 깜박임은 시도해본적이없고 흔히 넷츠케이프에서만 가능한다하네요 ^^
td { font-family:돋움; font-size:9pt; }을 뒤져봅시다.
font-family:돋움 은 폰트입니다.
단 웹폰트만가능합니다..(궁서,돋움,바탕 이 대표적)
그리고 font-size:9pt; 는 크기
pt는 바꾸지말고 숫자만 바꿔줍시다.
헥헥 그리고 줄이는 방법..
맨위에 보기로 나온것을 줄이면,
<style>
<!--
td { font-family:돋움; font-size:9pt; }
a:link, a:visited, a:active { color:rgb(14,108,167); text-decoration:none; }
a:hover { color:rgb(14,108,167); text-decoration:underline; }
-->
</style>
이 됩니다.
속성인 a:link, a:visited, a:active이 전부{ color:rgb(14,108,167); text-decoration:none; }이 속성값을 나타내는거죠
사실상 a:link, a:visited, a:active이 속성들은 모두 다를 경우가 드물어서 속성값이 모두 동일하면 하는것이 good이라 봐야합니다. 최대한 용량을 줄이는 셈 ^^

그리고 최대한 줄일려면
링크관련스타일시스(scc)속성을 넣어줄파일이있는같은 폴더에mainscc.scc라는 파일을 넣어주세요~
그리고 그것을 메모장으로열어서
예제로
<style>
<!--
td { font-family:돋움; font-size:9pt; }
a:link, a:visited, a:active { color:rgb(14,108,167); text-decoration:none; }
a:hover { color:rgb(14,108,167); text-decoration:underline; }
-->
</style>라는 소스를 줄일려면
td { font-family:돋움; font-size:9pt; }
a:link, a:visited, a:active { color:rgb(14,108,167); text-decoration:none; }
a:hover { color:rgb(14,108,167); text-decoration:underline; }
만 넣어서 저장해주십쇼 ^^
그리고,링크관련스타일시스(scc)속성을 넣어줄파일을 열고<HEAD>~</HEAD>사이에
<link rel="stylesheet" href="mainscc.scc">라고 넣어주세요
그럼 끝 헥헥헥
그러면 안뇽~(꾀죄죄 ㅠㅠ)
이 게시물을
수정 삭제
좋아요
목록
태그 쓰기