Programming (421) 썸네일형 리스트형 CSS padding CSS padding exam.htmlDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> #box1 { width:150px; height:100px; border:1px solid black; /* 테두리 상자안에 위아래 왼쪽 오른쪽 테두리 */ /*padding:10px;*/ /*background-color:orange;*/ /* padding-top:10px; padding-right:0px; padding-bottom:30px; Padding-left:0px; */ padding:10px 0px 30px 0px; } #text1 { b.. CSS 레이아웃:border CSS 레이아웃:borderexam.htmlDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> #box1 { width:100px; height:100px; border:1px orange solid; /* border-style:solid; border-color:orange; border-width:1px; */ font-size:12px; } #box2 { width:100px; height:100px; border:dotted orange 1px; } #box3 { width:100px; height:100px; border:inset .. CSS overflow CSS overflow exam.htmlDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> #div1 { background-color:yellow; width:100px; height:100px; overflow:auto; /*약관동의에 overflow:auto속성을 사용하면 좋다 .iframe도 쓴다.*/ } td { width:100px; height:100px; } 내용물입니다.내용물입니다.내용물입니다.내용물입니다.내용물입니다.내용물입니다.내용물입니다.내용물입니다. 내용 테이블속성에선 스타일시트에 오버플로우가 먹지 않지만 div태그를 안.. CSS box 예제 몇가지 CSS box 예제 몇가지 exam.htmlDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> table { /*height 높이의 경우는 얼마만큼 지정이 되어있지 않기 때문에 절대값으로 기재해야 한다.*/ /*인라인 요소는 너비를 지정하지 않는다. */ width:50px; height:50px; } 영역 결과 CSS 레이아웃 개념 정리, display CSS 레이아웃 개념 정리, display exam.htmlDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> span { display:block; background:orange; } h3 { display:inline; } a { display:none; } /* 첫번째 태그 ul li 태그를 지정한다.*/ #list1 li { display:inline; width:100px; } 안녕하세요. 홍길동입니다. 안녕하세요. 홍길동입니다. 링크입니다. 마지막입니다. 항목1 항목2 항목3 항목4 항목5 항목6 항목7 항목8 결과 CSS 마우스:hover,visited,focus CSS 마우스:hover,visited,focusexam.htmlDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> /* hover - 마우스가 올라가 있는상태를 가르킨다.*/ a:hover { color:#ccff66; } /* visited - 이미 클릭한 링크 상태를 가르킨다.*/ a:visited { color:black; } a { color:black; font-size:12px; text-decoration:none; } a:hover{ color:#00ff33; /*font-size:20px;*/ text-decoration:un.. CSS Background image:url, repeat, position CSS Background image:url, repeat, positionexam.htmlDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> #txt1, #btn1 { background-color:black; color:white; font-weight:bold; } #search { /*background-image:url(images/sp_fms.gif);*/ /*background-repeat:no-repeat;*/ /*가로는 가운데 세로는 현재위치(0)*/ /*background-position:center -18px;*/ /*bac.. CSS 결합자, 배경, 동적 생성자 그림설명 : selector CSS 결합자, 배경, 동적 생성자 그림설명 : selector DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> /* 구체적으로 태그를 선택 할수 있다 최상위 직계자식인 녀석만 구분자 > 이것으로 구분한다.*/ div > a { font-size:30px; } 네이버 네이버2 이전 1 ··· 48 49 50 51 52 53 다음
