CSS 참조 설명서

CSS @규칙(RULES)

CSS 속성 전체 목록

CSS 함수(Function)CSS 선택자 전체 가이드북

CSS3 [attribute*=value] 선택자

attribute 이름을 가진 속성이 있으며 속성 값이 "value"를 포함하는 요소를 나타냅니다。

전체 CSS 선택자 참조 매뉴얼

온라인 예제

href 속성이 있으며 속성 값이 "example"를 포함하는 <a> 요소가 있으면, 다음과 같은 선택자입니다

예제

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>기본 가이드(oldtoolbag.com)</title>
<style>
/*　href 속성이 있으며 속성 값이 "example"를 포함하는 <a> 요소가 있으면, 다음과 같은 선택자입니다　*/
a[href*="example"]　{
　　font-size:　2em;
}
</style>
</head>
<body>
<div>
<ul>
　　<li><a href="#internal">Internal 링크</a></li>
　　<li><a href="http://example.com">Example 링크</a></li>
　　<li><a href="#InSensitive">Insensitive 내부 링크</a></li>
　　<li><a href="http://example.org">Example org 링크</a></li>
</ul>
</div>
</body>
</html>

테스트를 보세요 ‹/›

정의와 사용법

[attribute*=value] 선택자는 특정 값을 포함하는 요소와 일치하는 선택자입니다。

브라우저 호환성

IEFirefoxOperaChromeSafari

모든 주요 브라우저에서 [attribute*=value] s 선택자입니다。

주의: [attribute*=value]는 IE8에서 실행할 때는, 선언해야 합니다 <!DOCTYPE> 。

온라인 예제

class 속성 값이 "test"를 포함하는 모든 요소의 배경색을 설정합니다：

예제

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">　
<title>기본 가이드(oldtoolbag.com)</title>　
<style>　
[class*="test"]
{
background:#ffff00;
}
</style>
</head>
<body>
<div class="first_test">제1개 DIV 요소.</div>
<div class="second">제2개 DIV 요소.</div>
<div class="test">제3개 DIV 요소.</div>
<p class="test">이것은 일반적인 텍스트 파라그래프.</p>
</body>
</html>

테스트를 보세요 ‹/›

전체 CSS 선택자 참조 매뉴얼

CSS 함수(Function)CSS 선택자 전체 가이드북