여러분 클래스 중첩에대해서 아셧나용~?
드디어 클래스 중첩에 대해서 알게됫습니다. 부끄부끄...
Class 를 한개의 Element 안에 여러개 중복해서 넣을수있더군요..
예를 들어 디자인을 여러개 해놓고 한개의 객체에 여러종류의 클래스 속성을 중첩해서 넣을수잇다는거죠
<style>
.background_red { background:red; }
.border_ccc { border:4px solid #ccccccc; }
</style>
이런 스타일시트가잇을떄
<div class="background_red border_ccc"></div> 요롷게 두가지 속성을 넣을 수 있더라구요
신기하네요 <!Doctype Html> 에서 작업햇습니다.
댓글 5개
13년 전
그렇다면 다음의 경우는 어떻게 될까요? ^^;
1. 두개 이상의 클래스가 충돌할때는?
예: <h2 class='title new'>
h2.new { color:violet; }
h2.title { color:red; }
2. 또는 여러 css 선택자가 충돌할때는?
예: <h2 id='p123' class='title'>
h2 { color:green;}
h2.title { color:red;}
h2#p123 { color:blue;}
1. 두개 이상의 클래스가 충돌할때는?
예: <h2 class='title new'>
h2.new { color:violet; }
h2.title { color:red; }
2. 또는 여러 css 선택자가 충돌할때는?
예: <h2 id='p123' class='title'>
h2 { color:green;}
h2.title { color:red;}
h2#p123 { color:blue;}
13년 전
우선순위는 소스에 쓰여진 스타일시트 가 1순위며 클래스 중에서도 같은 파일에 존재하는게 2순위 3순위는 외부에서 가져온 파일입니다.
또한 앞의 선택자를 따라가면서 충돌이 날 경우 제일 앞의 것만 읽어오고 나머지는 처리를 안하고요
id 와 클래스가 있다면 id 를 따릅니다. id 는 단일된거라면 class 는 다중으로 사용이 가능하기 때문이죠
또한 앞의 선택자를 따라가면서 충돌이 날 경우 제일 앞의 것만 읽어오고 나머지는 처리를 안하고요
id 와 클래스가 있다면 id 를 따릅니다. id 는 단일된거라면 class 는 다중으로 사용이 가능하기 때문이죠
게시판 목록
자유게시판
| 번호 | 제목 | 글쓴이 | 날짜 | 조회 |
|---|---|---|---|---|
| 공지 |
|
1주 전 | 29 | |
| 199718 |
|
1주 전 | 21 | |
| 199717 | 4주 전 | 23 | ||
| 199716 |
느긋한카키쿠키
|
4주 전 | 18 | |
| 199715 |
현대적인무질서한까마귀
|
4주 전 | 20 | |
| 199714 | 4주 전 | 28 | ||
| 199713 | 4주 전 | 37 | ||
| 199712 | 1개월 전 | 297 | ||
| 199711 |
안졸리니졸리니
|
1개월 전 | 146 | |
| 199710 |
|
1개월 전 | 161 | |
| 199709 |
|
1개월 전 | 94 | |
| 199708 | 1개월 전 | 107 | ||
| 199707 | 1개월 전 | 241 | ||
| 199706 | 1개월 전 | 45 | ||
| 199705 | 1개월 전 | 29 | ||
| 199704 | 1개월 전 | 49 | ||
| 199703 | 2개월 전 | 57 | ||
| 199702 | 2개월 전 | 100 | ||
| 199701 | 2개월 전 | 112 | ||
| 199700 | 2개월 전 | 83 | ||
| 199699 | 2개월 전 | 89 | ||
| 199698 | 2개월 전 | 135 | ||
| 199697 | 2개월 전 | 99 | ||
| 199696 |
|
2개월 전 | 247 | |
| 199695 | 2개월 전 | 90 | ||
| 199694 | 2개월 전 | 119 | ||
| 199693 | 2개월 전 | 188 | ||
| 199692 | 2개월 전 | 198 | ||
| 199691 |
|
2개월 전 | 171 | |
| 199690 | 2개월 전 | 258 | ||
| 199689 | 2개월 전 | 161 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기