>  기사  >  웹 프론트엔드  >  CSS 기본 지식 프레임워크 다이어그램

CSS 기본 지식 프레임워크 다이어그램

高洛峰
高洛峰원래의
2016-11-23 15:11:441784검색

css 기본 지식 프레임워크: (1: 기본 지식 개요. 2 기본 지식 프레임워크 다이어그램)

1. CSS 스타일 시트의 기본 개념

2. - --1. 내장 스타일 2. 인라인 스타일 3. 외부 스타일 시트 링크 4. 외부 스타일 가져오기

3. 스타일 시트 구성 방법

4. .font-family

2.font-size(4가지 크기 방법: 절대 크기(xx-small...medium...xx-large7 유형), 상대적(대형, 소형, em), px, %)

3.글꼴 두께(6가지 방식, 보통(400), 굵게(700), 굵게, 가벼움, 100...900, 상속)

4. 글꼴 스타일 (보통, 이탤릭, 오블리크 3종)

5.font-variant (보통, 소문자, 상속)

6.font

5. ---1.text-align(5가지 속성 정렬, 상속) 2.letter-spacing 3.color(3가지 색상 특성)

6. 배경색 및 이미지 설정

1. background -색상

2.배경 이미지

3.배경-반복(5가지 반복,반복-x,반복-y,이탄 없음,상속)

                                     배경 -첨부파일                                                                     🎜>

6. 배경 원본(배경 이미지 표시를 시작하는 위치 3가지 패딩 상자, 테두리 -box, content-box) text)

7. 테두리

1.border-width (테두리 5종, border-left-width (왼쪽, 오른쪽, 아래쪽))

2.border-style (border-(위|왼쪽|오른쪽|아래) -style 네 가지 유형 아래에 9개의 동일한 스타일이 있습니다. ///none/dotted/dashed/solid/double/groove/ridge/inset/outset)

                                                                                                               테두리 색상(왼쪽 여백,,) 패딩)

9. 웹페이지 하이퍼링크 설정

1. 웹페이지 링크 속성(4가지 링크 방식)

2. 스크롤바 속성 추가 오버플로(overflow-x,overflow-y)로 각각 나누어져 있습니다. 4가지 유형 1 .visible (모든 문단 표시, 스크롤바 없음) 2.auto (용량 초과시 스크롤바 표시) 3.hidden (스크롤바 숨기기) 4.scroll (항상 스크롤바 표시)

3. 커서 속성 설정(커서: hand|crosshair|text|waithourglass|help|move|e-resize|ne-resize|nw-resize|s-resize|url('#'))

10. 영역 및 위치

1. 위치 이해(상대 위치 및 절대 위치)

2.z-index 스택 순서

3.float 부동 속성                                                                 

4.clear 속성 지우기 

5.clip은 CSS의 가위손입니다.                      오버플로가 범위를 벗어났습니다(5가지 유형의 표시(부분 오버플로 초과)가 숨겨짐, 자동 오버플로가 표시됨) 그렇지 않으면 상속)

7.가시성(표시, 숨김, 축소, 상속 4가지 유형)

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.