공지 |
HTML
HTML 기초 다지기
4
|
오작교 | 227290 | | 2008-06-17 | 2010-08-19 13:08 |
공지 |
HTML
HTML과 CSS의 종합 정리
1
|
오작교 | 294933 | | 2007-10-01 | 2010-08-19 12:45 |
공지 |
일반
스타일시트의 총정리
|
오작교 | 245103 | 14 | 2006-09-14 | 2010-08-19 12:45 |
54 |
CSS
스타일 시트 위치조정과 레이어 조정
|
오작교 | 20643 | | 2009-07-07 | 2009-07-07 17:18 |
이번 장에서는 스타일 시트 위치지정과 레이어에 대해서 알아보겠다. ☞ position , left , top 스타일 시트의 요소의 위치를 조절해주는 속성이다. h2 { position: absolute; left: 100px; top:40px; } 대충 이렇게 사용됩니다. position 속성의 경우 absolute...
|
53 |
CSS
a태그에서 밑줄 없애기와 이미지 고정
|
오작교 | 29670 | | 2009-07-07 | 2009-07-07 17:22 |
☞ 밑줄 없애기 & 앵커 가상 클래스 효과 먼저 우리가 글자에 하이퍼링크를 설정해주면 글자가 파란색으로 변하면서 밑줄이 쫙~ 생기죠... 이걸 없에는 방법이 있습니다. 물론 스타일시트를 이용해서 없앨 수 있습니다. 게다가 앵커 가상 클래스까지 첨부시...
|
52 |
CSS
스크롤바 디자인 하기
1
|
오작교 | 26138 | | 2021-01-09 | 2022-02-02 11:30 |
scroll bar 디자인::-webkit-scrollbar { width: 5.2px; } /* 스크롤 바 */ ::-webkit-scrollbar-track { background-color:#fff; } /* 스크롤 바 밑의 배경 */ ::-webkit-scrollbar-thumb { background: #ddd; border-radius: 10px; } /* 실질적 스크롤 바 */...
|
51 |
CSS
포토샵 태그 - 1
2
|
오작교 | 28392 | | 2010-05-25 | 2022-01-03 11:15 |
|
|
CSS
포토샵 태그 - 2
|
오작교 | 29905 | | 2010-05-25 | 2010-05-25 22:18 |
|
49 | |
CSS
padding, margin, font, bold
|
오작교 | 55983 | | 2010-03-23 | 2010-03-23 08:22 |
|
48 |
CSS
CSS 글꼴 크기 대조표
|
오작교 | 61830 | | 2011-06-03 | 2011-06-03 10:29 |
CSS 글꼴단위 대조표 points pixels ems percent 6pt 8px 0.5em 50% 7pt 9px 0.55em 55% 7.5pt 10px 0.625em 62.5% 8pt 11px 0.7em 70% 9pt 12px 0.75em 75% 10pt 13px 0.8em 80% 10.5pt 14px 0.875em 87.5% 11pt 15px 0.95em 95% 12pt 16px 1em 100% 13pt 17...
|
47 |
CSS
CSS로 바꾸어 주는 HTML 소스
|
오작교 | 52055 | | 2007-09-17 | 2007-09-17 23:35 |
XHTML및 HTML 4.01부터 사용 불가능한 태그 : center, s, strike, u 등이 있습니다. center의 대책!.. CSS로 바꾸어 씁니다. text-align: center; s의 대책!..[strike 포함] CSS로 바꾸어 씁니다. text-decoration: line-through; u의 대책!.. CSS로 바꾸어 씁...
|
46 |
CSS
div 두 개 나란히 이어 붙이기
2
|
오작교 | 82333 | | 2007-10-23 | 2007-10-23 17:35 |
아래와 같이 두 셀을 가로로 나열하기 위해 테이블로 아래와 같은 간단한 방법을 사용하실 수 있습니다. 안녕하세요 오작교의 홈입니다. <tr> <td width="200" bgcolor="#aaaaaa">안녕하세요</td> <td width="200" bgcolor="#cccccc">오작교의 홈입니다.</td> ...
|
45 |
CSS
이미지 맵 태그 -1
|
오작교 | 32469 | | 2010-05-25 | 2010-08-19 13:22 |
|
44 |
CSS
스타일 시트 활용(2) - 레이아웃을 원하는 대로
|
오작교 | 17403 | 11 | 2006-04-17 | 2006-04-17 16:10 |
먼저 스타일을 안쓰고 문서의 여백을 0으로 만들고자 할때는 <html> <head> <title>여백 0 만들기</title> <body bgcolor="White" text="black" leftMargin=0 topMargin=0 marginheight="0" marginwidth="0"> <img src="test.jpg" > </body> </html> 이렇게 하...
|
43 |
CSS
스타일 시트 활용(4) - 커서 모양을 마음대로
|
오작교 | 13413 | 12 | 2006-04-17 | 2006-04-17 16:13 |
여러분들이 웹서핑하다가 링크가 걸려있는 글이나 이미지에 마우스를 올려 놓으면 커서 모양이 손가락으로 변하지요? 근데 링크 말고도 글에서 특정부분이나 링크가 안 걸려져 있는 이미지에 마우스를 올려놓으면 커서 모양을 손가락 모양은 물론 모래시계 모...
|
42 |
CSS
칼라에 관한 스타일시트-2
|
오작교 | 14496 | 12 | 2006-05-06 | 2006-05-06 10:22 |
background-images 와 background-repeat 에 대한 예제를 보도록 하겠습니다. <style type="text/css"> <!-- body { background-image : url(https://tagmania.net/img/jang.jpg) ; background-repeat : repeat-y ; } .love { font-size : 13px; color : green...
|
41 |
CSS
스타일 시트로 배경에 글래디언트 효과
|
오작교 | 15931 | 12 | 2006-05-06 | 2006-05-06 20:03 |
<head>사이에 <style type="text/css"> .color1 {filter='progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=yellowgreen, EndColorStr=#FFFFFF)';font-size: 9pt; border:0 solid #000000;height:40px;} .color2 {filter='progid:DX...
|
40 |
CSS
특정링크 색상 다르게 지정하기
|
오작교 | 16768 | 12 | 2006-06-03 | 2006-06-03 21:13 |
아 이거 안된다고 한참 고민했습니다 -_- A:link {color:#3E4773;text-decoration:none;} A:visited {color:#3E4773;text-decoration:none;} A:active {color:#3E4773;text-decoration:none;} A:hover {color:#636FAC;text-decoration:none;font-weight:bold} ...
|
39 |
CSS
CSS란 무엇인가?
|
오작교 | 73910 | 13 | 2006-04-17 | 2006-04-17 15:59 |
CSS 는 Cascading Style Sheets 의 약자로 일반적으로 CSS 내지는 스타일 시트 라고 불리어 집니다. 이것이 하는 주된 기능(?)은 문서의 글자모양, 크기, 링크형식 결정, 행간 길이 조절, 여러종류의 문자종류 설정, 마진값 조절, 문자에 간단한 효과주기 등입...
|
38 |
CSS
싸이즈대로 새창 띄우기(여러 가지 문서)
|
오작교 | 14058 | 13 | 2006-09-14 | 2006-09-14 10:47 |
1번=플래시가 들어있는 html문서 2번=동영상이 들어있는 html문서 3번=이미지가 들어있는 html문서 4번=플래시가 들어있는 html문서 로서 각각의 문서에 모두 script src="resizewin.js"를 넣어줘야 하며 head부분에 dolion = new resizeWin(600,550); dolion....
|
37 |
CSS
스타일 시트 활용(3) - 문서내에 작은 스크롤상자 만들기
|
오작교 | 14873 | 14 | 2006-04-17 | 2006-04-17 16:10 |
css의 overflow 속성을 이용하면 깔쌈한 스크롤 박스를 만들수 있습니다. 이 효과를 쓰시면 html 문서내에 iframe을 적용한 효과 비슷하게 나오지만 더욱더 활용도가 높습니다. iframe처럼 문서 하나 더 들어가지도 않고 스타일시트로 효과도 줄 수 있으니까요...
|
36 |
CSS
스타일시트로 배경에 그라이언트 효과
|
오작교 | 13818 | 14 | 2006-09-14 | 2006-09-14 11:47 |
<head>사이에 <style type="text/css"> .color1 {filter='progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=yellowgreen, EndColorStr=#FFFFFF)';font-size: 9pt; border:0 solid #000000;height:40px;} .color2 {filter='progid:DX...
|
35 |
CSS
스타일 시트 (2) - 예제를 통해 감을 잡자
|
오작교 | 13180 | 15 | 2006-04-17 | 2006-04-17 16:04 |
앞에서도 살펴보았듯이 스타일 시트는 양식과 구조를 분리하는 특징을 가지고 있습니다. 여기에서는 한 문서내에 스타일 시트를 적용하는 예를 보여 드렸지만 스타일시트를 사용하면 사이트에 모든 페이지를 하나의 CSS 문서로 컨트롤 할 수도 있습니다. 지금...
|