- 연결 선택자(combination selector)란? 선택자와 선택자를 연결해 적용 대상을 한정시키는 방법 아래는 연결 선택자 예시를 위한 코드이다. 예약 방법 및 요금 직접 통화 문자 남기기 1인 : 40,000원 2인 : 60,000원 3인 : 480,000원 4인 : 100,000원 4. 형제 선택자(sibling selector) 인접 형제 선택자와 달리 모든 형제 요소에 적용된다. /* 형제 선택자로 변경 */ /* 기준요소 ~ 형제요소 { text-decoration:underline; } */ h1 ~ ul { color:blue; font-weight:bold; } 참고문헌 : 고경희(2019), HTML5+CSS3 웹 표준의 정석, 이지스 퍼블리싱

- 시맨틱 태그(semantic)란? semantic : 의미가 통하는 태그만 보고도 페이지 구조를 쉽게 이해할 수 있도록 정의된 태그 → 사용하지 않더라도 웹 문서를 만들 수 있으나, 웹 접근성 부분에서 매우 중요하다. Joandora 가장 제주다운 수산리집 이용 안내 객실 소개 예약 방법 예약하기 요안도라 소개 요안도라는 게스트 하우스(Guest House) 형식의 농어촌 민박입니다. 성산의 날씨는 다음주 내내 높은 구름에 ...... 오늘은 사진에 보이는 긴 돌담을 따라 ...... 내일은 두달 엳동안 밖거리에 만든 ...... 알립니다 게스트 하우스 예약은 전화 070-###-#### ...... 제주특별자치도 남제주군 성산읍 수산리 000번지 요안도라 yan##@naver.com Copyrigh..

- 여백을 조절하는 속성들 1. margin 속성 마진(margin)은 현재 요소 주변의 여백이다. → 한 요소와 다른 요소 사이의 간격을 조절할 수 있다. 제목 내용 제목 내용 제목 내용 제목 내용 2. padding 속성 패딩(padding)은 콘텐츠 영역과 테두리 사이의 여백이다. .outer div { width: 200px; height: 150px; border: 2px solid; margin: 30px; float: left; padding:10px; /* 위에 상자에서 padding 추가 */ } 참고문헌 : 고경희(2019), HTML5+CSS3 웹 표준의 정석, 이지스 퍼블리싱

- 스타일 우선순위, 스타일 상속 1. CSS란? CSS: Cascading Style Sheets의 약자 '위에서 아래로 흐른다'는 의미로, 선택자에 적용된 많은 스타일 중 어떤 스타일을 나타낼지 결정한다. 2. 스타일 우선순위 스타일 규칙의 중요도, 적용 범위에 따라 우선순위가 결정된다. 사용자 스타일 시트의 중요 스타일 : 저시력자나 색약자를 위한 스타일. 제작자 제어 불가 제작자 스타일 시트의 중요 스타일 : !important가 붙은 스타일 제작자 스타일 시트의 일반 스타일 기본적인 브라우저 스타일 시트 - 하나의 요소에 여러 스타일이 적용된 경우 ⑴ 인라인 스타일 > ⑵ id 스타일 > ⑶ 클래스 스타일 > ⑷ 태그 스타일 문단 텍스트 문단 텍스트 문단 텍스트 문단 텍스트 - 소스에서의 순서 ..

- 자주 사용하는 선택자 정리 1. 전체 선택자(universal selector) 모든 요소에 적용. 문서의 여백이나 글꼴 크기 등 기본 스타일을 초기화할 때 사용한다. → 전체 선택자로는 ＊를 사용한다. * { 속성: 속성 값; ... } 2. 태그 선택자(tag selector) 특정 태그가 쓰인 모든 요소에 스타일을 적용한다. /* 태그 { 스타일 } */ p { font-size:12px; /* 글자 크기 */ font-family:돋움; /* 글꼴 */ } 3. 클래스 선택자(class selector) 특정 부분에만 스타일을 적용할 때 사용 → 적용하려는 태그에 클래스를 붙여줘야 한다. /* .클래스명 { 스타일 } */ .bluetext { color:blue; /* 글자 색 */ } 4...