너와 나의 개발 고리

[CSS] CSS 선택자를 활용하여 작성하기(문제 풀기) 본문

CSS _HTML_JavaScript/문제 풀이

[CSS] CSS 선택자를 활용하여 작성하기(문제 풀기)

Oli-Viaaaa 2023. 7. 24. 17:37

문제 1. p 태그를 모두 선택한다.

 

문제 2. id 속성값이 title 인 태그를 선택한다.

 

문제 3. class 속성값이 box이면서 id 속성값이 title인 태그를 선택한다.

 

문제 4. section 태그의 하위에 있는 모든 div 태그를 선택한다.

 

문제 5. label 태그와 인접한 형제 관계인 input 태그를 선택한다.

 

문제 6. 링크 대상 경로가 http://www.naver.com인 인 a 태그의 하위에 있는 span 태그를 모두 선택한다.

 

 


 

▼▼▼ 아래에 정답 있어요 ▼▼▼

 


1. p 태그를 모두 선택한다.

더보기
<style>p{      color:red;}</style>

 

 

2. id 속성값이 title 인 태그를 선택한다.

더보기

<style>

#title{

    color:red;

}

</style>

 

 

3. class 속성값이 box이면서 id 속성값이 title인 태그를 선택한다.

더보기

<style>

.box#id{

    color:red;

}

</style>

 

 

4. section 태그의 하위에 있는 모든 div 태그를 선택한다.

더보기

<style>

    section div{

        color:red;

}

</style>

 

 

5. label 태그와 인접한 형제 관계인 input 태그를 선택한다.

더보기

<style>

    label+input{

        color:red;

}

</style>

 

 

6. 링크 대상 경로가 http://www.naver.com인 인 a 태그의 하위에 있는 span 태그를 모두 선택한다.

더보기

<style>

    a [href="http://www.naver.com"] span{

        color:red;

}

</style>