태그 class 속성에 이런것은 무슨뜻인지???
본문
css 정의부가 아닌 html 부에
아래처럼 있는데요...
이것은 어떤 의미입니까?
<li class="sct_li sct_clear" style="width:230px">
"sct_li sct_clear" 는 .. 클래스명을 두개를 나열한개 아니라... 한개의 이름인가요?
클래스 이름을 이렇게 스페이스를 넣으면서 명명할 수 있습니까?
이런경우는 어떠한 목적으로 이름에 스페이스를 넣으면서 명명한것인지?
답변 2
li 라는테그에
sct_li 라는 클레스에 스타일과
sct_clear 라는 클레스를 두개 사용한다는것입니다.
<style>
.sct_1{color:#fff;}
.sct_2{border:1px solid;}
.sct_3 {background:#abc;}
</style>
<li class="sct_1 sct_2 sct_3">클레스 3개</li>
이렇게 하시면 클레스 3개가 중첩으로 다 적용이 됩니다.
최대 게수는 테스트 안해봤네요 ㅎㅎ
감사합니다^^
그런데요
해당 css파일에
.sct_li는 단독으로 정의가 되어있기는 한거 같은데요
.sct_clear는 아래처럼 .sct_clear정의가 나와있기는 한데요
이외에 .sct_clear 가 단독을 나와있어야 같은데 .. 단독으로 나온게 없습니다.
갱쿤님 말씀대로라면 단독으로 .sct_clear 정의가 나와야 하는거 아닌가요?
/* 상품 목록 스킨 10 */
.sct_10 .sct_li {position:relative;float:left;margin:0 -1px 15px 0;border: 1px solid silver;padding: 20px;}
.sct_10 .sct_last {margin:0 0 15px !important}
.sct_10 .sct_clear {/*! clear:both; */}
프로그래머님말슴대로 보시면
.sct_10 .sct_li {position:relative;float:left;margin:0 -1px 15px 0;border: 1px solid silver;padding: 20px;}
.sct_10 .sct_last {margin:0 0 15px !important}
.sct_10 .sct_clear {/*! clear:both; */}
<ul class="sct_10">
<li class="sct_li sct_last sct_clear ">
클래스 3개 먹은 이 li는
position:relative;float:left;margin:0 -1px 15px 0;border: 1px solid silver;padding: 20px;
margin:0 0 15px !important
clear:both;
이3게 스타일이 3개 전부다 먹었습니다.
</li>
</ul>
id 와 cass 합
<div id="test" class="sct_li sct_last sct_clear ">
방식으로 아이디 값에는 한번 적용하고
클레스로 중첩을 줄수있는 방법도 있으세요~ ^^
</div>
클래스는 한객체에서 여러개 사용이 가능하고 한페이지에서 중복사용도 가능합니다
하지만, 아이디는 한객체에 한개만 사용가능하고 한페이지에서 중복되면 안됩니다
즉,
<div id="AAA" class="aaa bbb ccc">테스트</div>
<ul id="BBB" class="bbb ccc" >
<li class="ccc">테스트 LI 1</li>
<li class="ccc">테스트 LI 2</li>
</ul>
<address id="AAA">테스트 어드레스</address> <===== 이렇게 div의 id와 address의 id가 중복되면 안됩니다
이런식으로 사용이 가능합니다
