스타일은 HTML5 사용자 정의 요소에 적용되지 않습니다.

오케이, 이것은 정말로 이상한 경우입니다. "사용자 정의"태그의 스타일을 지정하는 페이지가 있습니다. 생산에서스타일은 HTML5 사용자 정의 요소에 적용되지 않습니다.

<comment>This is a comment</comment>

, I 출력 HTML 템플릿에서 간단한 스타일은 표시하지 않도록 :

<style type="text/css"> 
    comment {display:none;} 
</style>

이상한 일입니다 내가 크롬의 개발 도구에서 <style> 노드를 편집 할 경우 무의미한 것을 추가하십시오. 한 공간처럼 ... 갑자기 작동합니다. 여기에 comment 노드의 스타일의 사진입니다 때 페이지가 처음로드 :

on first page load

그리고 무슨 일이 수도에 style 요소에

enter image description here

어떤 생각을 하나 개의 공간을 추가 한 후 다음이있다 무슨 일 이니?

사용자 정의 요소를 등록하셨습니까? 'document.registerElement ('comment'); ' – enyce12

정말 이것을 재현 할 수 없습니다. 나는 @ enyce12로 갈 것이지만, Chrome이 처음에는 건너 뛰는 것처럼 들리지만, 무엇을 만들지는 확실하지 않고 이후에야 요소에 대해 학습합니다. – gpgekko

확인 사용자 정의 요소를 등록하고 대시 (-)로 분리하십시오 : 그렇지 않으면 브라우저가 사용자 정의 요소로 인식 할 수 없습니다,

document.registerElement('x-comment');

당신의 요소가 대시를 포함해야합니다 . 에서

specs : 사용자 정의 요소 유형은 NCName에 생산 일치해야합니다 문자의 순서를 사용자 정의 요소 인터페이스를 식별하고있다

, 는 U + 002D 하이픈-MINUS 문자를 포함해야하며, 대문자 ASCII 문자 을 포함 할 수 없습니다. [...]

2014-07-15 11:56:50 enyce12

우와 ... T.I.L.! 그것은 @ enyce12 : D –

wait ... ...을 사용했을 것 같습니다. 그러나, 나는'x-'를 사용하지 않았습니다. 이것이 요구 사항임을 지적하는 문서가 있습니까? –

@JoelMartinez 업데이트 된 답변보기 – enyce12

답변