2
저는 오늘 아침 누군가의 웹 사이트 구현을보고 있었고 LINK 태그의 data-uri를 통해 CSS를 정의하고있는 것을 보았습니다.CSS 인라인 대 데이터 URI로 인코딩 되었습니까?
이미지를 데이터 uri와 , 즉 CSS에 넣는 것이 합리적인 점을 이해하고 있지만 인라인 할 수있을 때 CSS를 포함시키는 이유를 분명하지 않습니다. .
링크에 ID가있는 것을 확인했습니다. 그것은 동적으로 생성 된 요소의 "스타일"의 가치를 위해 DOM을 사용하여이 CSS를 동적으로 잡을 수 있습니까? 나는 프론트 엔드 jock이 아니지만 이것을 할 수있는 다른 방법이 있다고 생각합니다.
<link id="noteanywherecss" media="screen" type="text/css" rel="stylesheet" href="data:text/css,.note-anywhere%20.closebutton%7Bbackground-image%3A%20url%28chrome-extension%3A//bohahkiiknkelflnjjlipnaeapefmjbh/asset/deleteButton.png%29%3B%7D%0A.note-anywhere%20%7Bbackground-color%3A%20%23FFF046%3B%7D%0A.note-anywhere%20%7Bcolor%3A%20%23000066%3B%7D%0A.note-anywhere%20%20.edit%20%7Bfont-family%3A%20Arial%2C%20Helvetica%2C%20sans-serif%3B%7D%0A.note-anywhere%20%20.edit%20%7Bfont-size%3A%2014px%3B%7D%0A.note-anywhere%20.timestamp%20%7Bbackground-color%3A%20%23DDBB00%3B%7D%0A.note-anywhere%20.timestamp%20%7Bcolor%3A%20%23FFFFFF%3B%7D">
그건 이상한 일입니다. 어쩌면 데이터를 지원하는 브라우저 만 타겟팅하려 할 수도 있습니다. – bfavaretto
+1 좋은 질문입니다. 나는 당신이 인라인 스타일을 의미하는 것은 아니지만 저자 url css 선언 대 데이터 uri를 가진 "external"스타일 선언을 의미한다고 생각합니다. 인라인 스타일은 태그에서 직접 선언되며 더 높은 특이성을 갖습니다. –
@FabianBarney "인라인 스타일"을 명확히하기 위해 :
에