cascading 계단식
style 멋내기
sheets 한장
계단식으로 스타일 정의하는 문서
html문서에 스타일 더해준다. 디자인 입혀주기
색상 크기 위치 등
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>css만들기</title>
<link href="style1.css" rel="stylesheet">
</head>
<body>
<p>
html와 css 연결해보자.
</p>
</body>
</html>
타이틀 아래
헤드 위
<link href="style.css" rel="stylesheet">
이 연결
선택자{
속성명: 속성값;
}
color: red;
font-size: 32px;
1.모든요소
*(애스터리스크)
문서 내의 모든 요소를 의미하는 기호
2. 태그 선택자
예를 들어 p태그 해당요소 다 색칠해주기
3. 클래스 선택자
.<-클래스를 고르는 법
예시)
.text{
color: blue;
}
4. 아이디 선택자 (단 하나의 요소만 택할때)
#topic{
color: blue;
}
5.그룹 선택자
다양한 유형 요소를 한꺼번에 선택하고자 할 때
h1, p, div{
color: blue;
}
우선순위는
아이디선택자>클래식선택자>태그선택자
html은 <!----!> 각주
css는 */ /*각주
'프론트엔드 > css' 카테고리의 다른 글
| [유노코딩 css 8강] padding과 margin (0) | 2023.08.02 |
|---|---|
| [유노코딩 css 7강] 박스 (0) | 2023.08.02 |
| [유노코딩 css 6강] div,span의 블록,인라인 여부, border의 하위속성 (0) | 2023.08.02 |
| [유노코딩 css 5강] 텍스트 관련 속성 (0) | 2023.08.02 |
| [유노코딩 css 4강] css 선택자란? 태그선택자,클래스선택자,id선택자 중복될 때 우선순위 (0) | 2023.08.02 |
