-
practice06카테고리 없음 2023. 11. 10. 05:39728x90반응형SMALL
기본선택자를 연습해보자.!
<h1>
<p>
<span>
<ol>
<li>
를 사용했다.
h1은 헤드라인 가장 두꺼운? 굵은? 뚜렷한? 글자를 나타낸다.
p는 paragraph 단락.
span은 아무 의미없는 빈 공간 같은 개념 글자 하나만 꾸미거나 할 때 쓰이기도 하고 before after 등등의 부가적 요소를 위해 많이 쓰임.
ol은 ordered list 이의 반대 개념은 ul이며 unordered list
li은 list 는 ol과 ul 안에서 들어간다.
<body><h1>기본 선택자 연습해보기</h1><p>기본선택자 연습을 해보아요!</p><span>안녕하세요</span><ol><li id="first">1</li><li class="second">2</li><li>3</li><li>4</li><li>5</li></ol>선택자 id와 class를 사용했다.
id와 class의 개념의 이해가 필요하다.
id 속성은 태그에 유일한 이름을 붙이고 싶을 때 씁니다.
class 속성은 같은 유형으로 반복되는 태그들을 유형별로 분류하고 싶을 때 씁니다.
id 속성은 전체 페이지에서 단 하나의 요소에만 지정이 가능합니다.
사람으로 생각한다면,,
하나뿐인 사람 이름의 역할을 한다고 생각할 수 있습니다.class 속성은 id 속성과 다르게 여러 번 반복해서 사용할 수 있습니다.
반복적으로 쓰이는 유형들을 유형별로 동일한 class로 분류하여 쉽게 관리할 수 있습니다.중복 가능?
id 속성은 단 하나의 요소에만 쓸 수 있기 때문에 중복이 불가능하고
class 속성은 유형별로 동일한 class를 쓸 수 있기 때문에 중복이 가능합니다.CSS에서 차이?
CSS에서 id 속성을 사용할 땐 id명 앞에 # 기호를 붙이고 쓰면 됩니다.
id속성은 유일하고 특별하기 때문에 CSS에서 쓰일 때 클래스보다 우선적으로 적용이 됩니다.
class 속성을 사용할 때는 class 명 앞에 .(마침표) 기호를 붙이고 쓰면 됩니다.
마지막으로 정리하자면,
id속성은 유일하게 쓰이기 때문에 우선적으로 적용되며 중복이 불가하고,
class 속성은 반복적으로 쓰이는 유형들을 동일한 class로 분류하며 중복 가능합니다.
728x90반응형LIST