Front-End/UI
HTML tag와 속성, CSS 선택자
doriver
2024. 12. 22. 16:33
Tag
<h1> , <p> , <a> , <img>
<div> , <ul> , <li> , <table> , <tr>, <th> , <td>
, .... , <tagName>
Attribute
| 속성 | 사용예시 |
| href | <a href="https://www.w3schools.com"> Visit W3Schools </a> |
| style | <p style="color:red;">This is a red paragraph.</p> |
| src , width, height | <img src="img_girl.jpg" width="500" height="600"> |
| class | <div class="city"> , <h2 class="city main"> |
| id | <h1 id="myHeader"> |
name 속성
중복 가능: 한 HTML 문서 내에서 동일한 name 값을 가진 요소들이 여러 개 존재할 수 있습니다.
용도:
폼 요소(<input>, <select>, <textarea> 등)에서 사용
서버로 데이터를 전송할 때 동일한 name 값을 가진 여러 값이 배열 형태로 전달됩니다.
name 속성은 <iframe>, <a>, <meta> 등에서도 특정 목적으로 사용됨
전역 속성( Global Attributes )
모든 HTML 요소에서 공통으로 사용할 수 있는 전역 속성
| id | 문서 전체에서 유일한 고유 식별자 문서 내에는 주어진 id를 가진 요소가 하나만 존재함 |
| class | 요소의 별칭 |
CSS 선택자
| #id | 특정 ID를 가진 요소 선택 |
| .class | 특정 클래스를 가진 요소 선택 |
| tag | 태그 이름으로 요소 선택 |
| > | 바로 아래 자식 요소만 선택 |
직계 자식만 선택하려면 >를 사용하고, 모든 자손 요소를 선택하려면 띄어쓰기(' ')를 사용