반응형
⭕ CSS | 요소(Element)와 클래스(Class)의 차이
➡️ 요소 (Element)
- HTML 요소는 웹 페이지의 구조를 정의하고 의미를 담당합니다.
- 이러한 요소들은 특정 태그로 표현되며, 웹 브라우저에 어떻게 내용을 표시할지 알려줍니다.
- <h1>, <p>, <img>, <a>
p {
color: blue;
}
➡️ 클래스 (Class)
- 클래스는 HTML 요소에 스타일을 적용하기 위해 사용되는 식별자입니다.
- 클래스는 점(.)으로 시작하며, 하나 이상의 요소에 재사용 가능한 스타일을 정의할 수 있습니다.
- .menu, .header, .footer
.menu {
background-color: #333;
color: white;
padding: 10px;
}
.header {
font-size: 24px;
font-weight: bold;
}
.footer {
font-size: 14px;
text-align: center;
}
반응형
'프론트엔드 > CSS' 카테고리의 다른 글
CSS | 요소 임시 삭제 (81) | 2024.05.16 |
---|---|
CSS | 중앙 정렬 : 수평 중앙 정렬, 수직 중앙 정렬 (80) | 2024.05.16 |
CSS | CSS 초기화 (reset.css) (80) | 2024.05.16 |
CSS | CSS 선택자 : 기본 선택자, 복합 선택자, 동작 기반 가상 클래스 선택자, 가상 클래스 선택자, 가상 요소 선택자, 속성 선택자 (80) | 2024.05.16 |
CSS | 플렉스(Flex, Flexbox, Flexible Box Layout) 레이아웃 배치 (73) | 2024.05.14 |
CSS | position 위치 속성: Static, Relative, Absolute, Fixed, Sticky (74) | 2024.05.14 |
CSS | 여백 속성: Margin 및 Padding (74) | 2024.05.14 |
CSS | background-size 속성: contain 및 cover (73) | 2024.05.14 |