처음으로 여행안내 소개합니다 오시는 길 이용방법 객실요금 요금안내 예약하기 예약확인 게시판 공지사항 Q&A 사이트 맵 #nav{ width: 1000px; height: 45px; padding: 6px 7px; background: #999999; margin: 0 auto; } 직계자식 선택자에게 속성 추가 /* 자식 선택자를 통해 직계 li에게만 속성을 적용 */ #nav > li { float: left; position: relative; } margin: 3px 10px; margin-left: 80px; #nav li a { display: block; font: bold 20px sans-serif; color: #eeeeee; padding: 10px 20px; } /*li에 마우스를 올..
ol, ul, dl 목록 태그는 block형 속성! ol > li 순서가 있는 목록 ol과 li는 한 세트 2. 1,2,3 대신 알파벳등으로 변경 가능 ol태그 사용 li리스트1 li리스트2 li리스트3 ul > li ul과 li는 한세트, • 목록 동그라미 없애기도 가능 li{ list-style: none;} 동그라미 대신 이미지로 목록 만들기도 가능 li{ list-style: none; /* 점 제거하기 */ background: url("image/arrow.gif") no-repeat 0 52%;} dl > dt + dd 정의형 목록 정의 제목 정의 설명 dd가 들여쓰기 된다. bear 곰 참다/견디다
border-style border의 width, color, style을 함께 정의한 구조 (세가지 속성을 모두 갖고있어야함 순서는 달라져도 됨) div은 블록요소로 너비가 줄어들어도 블럭요소를유지한다. 상, 우, 하, 좌 각각의 속성들을 별개로 적용하고싶다면 border:가 아닌 border-width, border-style 등 풀네임을 사용해야한다 .div3{ border-width: 10px 20px 30px 40px; /* 시계방향으로 지정 : 상 우 하 좌 */ border-style: solid; border-color: blue red;} /* 상하 좌우 */ border radius 이미지도 가능! img{ border-radius: 250px;} 이미지 크기값과 라디우스 값이 같으면 ..
table 테이블의 기본 구조 table > tr > td 의 구조를 가진다. thead : table의 제목역할을 하는 컬럼들의 집합 tbody : table의 내용역할을 하는 컬럼들의 집합 tfoot : table의 내용을 정리하는 컬럼들의 집합 tr : table의 줄을 나눌때 사용. 행 (row) th : 셀의 주제를 나타낼때 사용 td : 셀의 내용을 나타낼때 사용. 열(column) 1행 구조의 표 표만들기 (1행 1열) 1행 1열 표만들기 (1행 2열) 1행 1열 1행 2열 2행 구조의 표 표만들기 (2행 1열) 1행 1열 2행 1열 표만들기 (2행 2열) 1행 1열 1행 2열 2행 1열 2행 2열 table_colspan 테이블 열 합치기 내친구 뽀로로 크롱 포비 td colspan = "..
