Programing

CSS 속성 선택기가 href가 작동하지 않습니다.

lottogame 2020. 8. 23. 09:38
반응형

CSS 속성 선택기가 href가 작동하지 않습니다.


CSS에서 속성 선택기를 사용하여 다른 색상과 이미지의 링크를 변경해야하지만 작동하지 않습니다.

이 HTML이 있습니다.

<a href="/manual.pdf">A PDF File</a>

그리고이 CSS :

a {
     display: block;
     height: 25px;
     padding-left: 25px;
     color:#333;
     font: bold 15px Tahoma;
     text-decoration: none;
 }
 a[href='.pdf'] { background: red; }

배경이 빨간색이 아닌 이유는 무엇입니까?


href 뒤에 $를 사용하십시오. 그러면 문자열의 끝과 일치하는 속성 값이 만들어집니다.

a[href$='.pdf'] { /*css*/ }

JSFiddle : http://jsfiddle.net/UG9ud/

E[foo]        an E element with a "foo" attribute (CSS 2)
E[foo="bar"]  an E element whose "foo" attribute value is exactly equal to "bar" (CSS 2)
E[foo~="bar"] an E element whose "foo" attribute value is a list of whitespace-separated values, one of which is exactly equal to "bar" (CSS 2)
E[foo^="bar"] an E element whose "foo" attribute value begins exactly with the string "bar" (CSS 3)
E[foo$="bar"] an E element whose "foo" attribute value ends exactly with the string "bar" (CSS 3)
E[foo*="bar"] an E element whose "foo" attribute value contains the substring "bar" (CSS 3)
E[foo|="en"]  an E element whose "foo" attribute has a hyphen-separated list of values beginning (from the left) with "en" (CSS 2)

출처 : http://www.w3.org/TR/selectors/

참고 URL : https://stackoverflow.com/questions/8850173/css-attribute-selector-does-not-work-a-href

반응형