CSS 역할 스타일 지정 방법

CSS 역할 스타일 지정 방법

다음 HTML로

<div id="content" role="main">

ID는 를 통해 접근할 수 있습니다.#contentCSS에서액세스 방법role="main".

CSS 속성 선택기 사용:

https://developer.mozilla.org/en-US/docs/CSS/Attribute_selectors

예:

div[role=main]

특정 분할에 액세스하는 셀렉터를 작성하는 가장 짧은 방법은 단순히 다음을 사용하는 것입니다.

[role=main] {
  /* CSS goes here */
}

이전의 답이 틀린 것은 아니지만, 디바를 사용하거나 특정 ID를 사용하여 사용자에게 의존합니다.이 선택기를 사용하면 모든 종류의 미친 마크업을 할 수 있고 여전히 작동하며 특정성의 문제를 피할 수 있습니다.

[role=main] {
  background: rgba(48, 96, 144, 0.2);
}
div,
span {
  padding: 5px;
  margin: 5px;
  display: inline-block;
}

<div id="content" role="main">
  <span role="main">Hello</span>
</div>

이렇게 액세스하면 다음과 같이 작동합니다.#content[role="main"]

물론 이 모드에서 수행할 수 있습니다.

 #content[role="main"]{
       //style
    }

http://www.w3.org/TR/selectors/ # attribute 선택기

사용할수 있습니다

 element[role="ourRole"] {
    requried style !important; /*for overriding the old css styles */
    }

자세한 정보를 보려면 이 스레드를 따르십시오.

CSS 속성 선택기:사용자 지정 특성에 값이 있는 경우 클래스를 적용하시겠습니까?그리고 IE7+에서도 가능할까요?

그리고 css 속성선택기를 배웁니다.

http://www.w3schools.com/css/css_attribute_selectors.asp

다음을 사용하십시오.

 #content[role=main]{
   your style here
}

언급URL : https://stackoverflow.com/questions/12892726/how-to-style-css-role