프로그래밍/web
CSS 기본 규칙
반응형
ㆍCSS 기본
선택자는 스타일을 적용할 요소를 선택하고, { } 안의 속성에 값만큼 적용 된다.
선택자 {
속성:값;
속성:값;
}
ㆍ선택자 종류
tag / id / class / 기타
- tag
<p> ... </p>
- id
태그에 아이디 설정 : <div id="name"> ... </div>
CSS선택사 자용: #name
- class
태그에 클래스 설정 :
<div class="name"> ... </div>
<span class="name"> ... </span>
CSS선택사 자용: .name
ㆍ색상선택 : w3schools color picker 참고
빛의 3원색 RGB 사용
R(red - 빨강) : 1~255
G(green - 초록) : 1~255
B(blue - 파랑) : 1~255
A(alpha - 불투명도) : 0~1 사이 소수점
색상코드 : #ffffff (16진수로 표기, 두자리씩 레드,초록,파랑)
RGB표기 : RGBA(빨강,초록,파랑,불투명도)
ㆍ크기단위
- 절대적인 단위(px)
px : 화면을 표시하는 가장 작은 정사각형 단위
- 상대적인 단위(%, em, rem)
% : 부모 태그에 대해서 상대적인 크기를 나타냄, 부모 태그의 영향을 받음
em(글자크기기준) : M문자 크기 기준, 부모태그의 영향을 받음 1em = 부모태그의 font-size
rem(글자크기기준) : 1rem = <html> (최상위 태그)의 font-size
ㆍCSS 코멘트 (주석)
/* 코멘트 내용 */
반응형
'IT > web' 카테고리의 다른 글
| CSS 스타일 텍스트 속성 정리 (0) | 2023.03.01 |
|---|---|
| HTML 문서에 CSS 스타일 적용하기 (0) | 2023.02.28 |
| HTML & CSS 참고 사이트 (0) | 2023.02.27 |
| HTML 문서에 구글애널리틱스 설치, 웹 데이터 스트림 (0) | 2023.02.26 |
| HTML 태그 <meta property="og:tilte" content="..."> (0) | 2023.02.26 |
댓글