Notice
Recent Posts
Recent Comments
반응형
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 |
Tags
- 리리카SOS
- 매드무비
- 던전앤파이터
- 트릭스터
- 하루히댄스
- 맑게맑게유쾌하게
- 럭키스타
- 어둠의전설
- not supported
- ED
- 위약3
- 갤럭시S
- 럭키☆스타
- 아이돌링
- 위약금제도3
- 스킨다부치
- Galaxy S
- 로고
- 스즈미야 하루히의 우울
- SKT 불매
- 디자인론
- 맑고맑게유쾌하게
- ハレ晴レユカイ
- 마도학자
- 코이즈미 이츠키
- Premiere Pro
- 던파
- 전면스킨
- 영상편집
- 할인반환금제도
Archives
- Today
- Total
IAress
웹표준과 접근성 5일차. 본문
반응형
** 스타일 효과를 보다 정확하게 적용하기
1. 단일 선택자
- 일반적인 css 적용 방법
2. 다중 선택자
- 여러 개의 선택자에 동싱[ㅔ 같은 효과 적용
선택자, 선택자, 선택자....(효과)
3. 부분 지정 선택자
- 같은 선택자라 하더라도 감싸고 있는 선택자가 다른 곳에 효과 적용
선택자 선택자 {효과}
body [type="text"] { padding: 10px; border: 3px solid red }
해당하는 태그가 있는 것에 대해 효과 적용
** 요소 레벨(Element Level, 태그의 레벨 구분)
1. 블록레벨(Block Level)
- 독립된 행을 가지는 태그
- 다른 블록레벨 요소와 인라인 요소 포함 가능
- p, h, ul, ol, li, div......
2. 인라인 레벨(Inline Level)
- 범위 표시 기능
- 다른 인라인 요소는 포함할 수 있지만, 블록 레벨 요소는 포함 불가
- a, img, strong, em, span....
*** DIV ***
페이지 레이아웃을 구성하기 위한 요소
(테이블의 대체 요소)
** 기본 레이아웃 **
1. 상단요소
- header
- 문서 전체에 보여져야 하는 내용
- 상단로고, Top Menu, GNB
(Global Navigation Bar)
2. 내용요소
- content
- 페이지별 전달하고자 하는 내용
- 로그인, 배너, 게시판, 정보전달텍스트....
3. 정보요소
- footer
- 회사나 홈페이지에 대한 정보 입력
- 하단로고, 전화번호, 주소, 팩스번호,사업자 등록 번호, 통신판매번호, 개인정보보호정책....
1. 단일 선택자
- 일반적인 css 적용 방법
2. 다중 선택자
- 여러 개의 선택자에 동싱[ㅔ 같은 효과 적용
선택자, 선택자, 선택자....(효과)
3. 부분 지정 선택자
- 같은 선택자라 하더라도 감싸고 있는 선택자가 다른 곳에 효과 적용
선택자 선택자 {효과}
body [type="text"] { padding: 10px; border: 3px solid red }
해당하는 태그가 있는 것에 대해 효과 적용
** 요소 레벨(Element Level, 태그의 레벨 구분)
1. 블록레벨(Block Level)
- 독립된 행을 가지는 태그
- 다른 블록레벨 요소와 인라인 요소 포함 가능
- p, h, ul, ol, li, div......
2. 인라인 레벨(Inline Level)
- 범위 표시 기능
- 다른 인라인 요소는 포함할 수 있지만, 블록 레벨 요소는 포함 불가
- a, img, strong, em, span....
*** DIV ***
페이지 레이아웃을 구성하기 위한 요소
(테이블의 대체 요소)
** 기본 레이아웃 **
1. 상단요소
- header
- 문서 전체에 보여져야 하는 내용
- 상단로고, Top Menu, GNB
(Global Navigation Bar)
2. 내용요소
- content
- 페이지별 전달하고자 하는 내용
- 로그인, 배너, 게시판, 정보전달텍스트....
3. 정보요소
- footer
- 회사나 홈페이지에 대한 정보 입력
- 하단로고, 전화번호, 주소, 팩스번호,사업자 등록 번호, 통신판매번호, 개인정보보호정책....
반응형
Comments