2017-10-02 4 views
2

표준 FAQ 형식의 웹 페이지를 가지고 있는데, 각 질문은 대답에 대한 링크로 나열되어 있습니다.hr 요소를 앵커로 사용할 수없는 이유가 있습니까?

앵커로 사용 된 hr 개의 요소가 있습니다. 각 요소에는 고유 한 id 속성이 할당되어 있지만 링크가 제대로 작동하지 않는 것으로 보입니다.

앵커 링크는 hr이 아닌 다른 요소와 함께 작동하는 것처럼 보입니다. 온라인에서는 앵커 포인트로 hr 요소를 타겟팅 할 수 없다는 것을 알 수 없습니다.

어떤 이유로 든 앵커 링크 대상에 hr 요소를 사용할 수 없습니까?

예, 편집 사용 내용 :

<ul> 
    <li><a href="#requirements">What are the technical requirements for using the online application system?</a></li> 
    <li><a href="#jobboard">Which job board should I use to apply for a position?</a></li> 
</ul> 

<hr id="requirements" /> 
<h3>What are the technical requirements for using the online application system?</h3> 
<hr /> 
<p>The COMPANY uses an online application system for most of our job postings. This system lets you create a profile to keep track of the positions you’ve applied for, provides confirmation that your application has been accepted, allows you to edit submitted applications up until the posting closing date, and notifies you via email of jobs that match your skills and interests.</p> 

<hr id="jobboard" /> 
<h3>Which job board should I use to apply for a position?</h3> 
<hr /> 
<p>COMPANY has a variety of employee groups, and certain groups may apply for positions on specific job boards. Here is a summary of what job board you should be checking:</p> 
+0

'시간'요소를 다른 것으로 전환 할 수없는 이유는 무엇입니까? – jmargolisvt

+0

왜 ID를 h3에 넣지 않으십니까? – sheplu

+0

유일한 수정 사항은 id를 연결된 h3으로 전환하는 것입니다. hr에 연결하는 관행을 제외하고는 문제가되지 않습니다. 사이트 전체에서 수백 개의 링크가 사용되었습니다. – hrecomms

답변

0

나는 온라인 hr 요소 앵커 포인트로 대상이 될 수 없음을 시사 아무것도 찾을 수 없습니다.

사양은 any element with an ID may be designated as the target of a URL fragment입니다. 규칙이 hr에 적용됨을 의미하는 예외는 명시되지 않습니다.

hr 요소에 연결하면 작동하지 않는 것으로 Google 크롬에서 나타납니다. 그것은 모든 다른 브라우저에서 잘 작동합니다. 크롬 버그라고 생각합니다.

해결 방법으로 hr 요소 (모두)를 제거하고 h3 요소에 ID를 다시 할당하십시오. 그것은 ID가 사용되는 방법입니다. hr 요소는 단일 섹션을 부제목이 불필요하거나 부적절한 개별 하위 섹션으로 나누는 경우에만 필요합니다. FAQ의 각 항목은 고유 한 제목으로 자체 제목이 있으므로 그 중 hr은 부적절하며 최악은 부적절합니다. 섹션 사이에 가로선을 표시하려면 hr 요소를 사용하는 대신 CSS로 경계선을 추가하십시오.

<ul> 
    <li><a href="#requirements">What are the technical requirements for using the online application system?</a></li> 
    <li><a href="#jobboard">Which job board should I use to apply for a position?</a></li> 
</ul> 

<h3 id="requirements">What are the technical requirements for using the online application system?</h3> 
<p>The COMPANY uses an online application system for most of our job postings. This system lets you create a profile to keep track of the positions you’ve applied for, provides confirmation that your application has been accepted, allows you to edit submitted applications up until the posting closing date, and notifies you via email of jobs that match your skills and interests.</p> 

<h3 id="jobboard">Which job board should I use to apply for a position?</h3> 
<p>COMPANY has a variety of employee groups, and certain groups may apply for positions on specific job boards. Here is a summary of what job board you should be checking:</p> 
0

은 이론적으로 HTML 5 Specification는 이러한 행위를 지원하는 브라우저의 문제에 내려와 것, 그러나 현실에서, (Global Attributes에 대한 지원을 통해)는 <hr> 요소에 ID 속성의 사용을 지원합니다.

일부 브라우저가 작동하지 않는 것으로 확인되면 <div> 또는 <a> 요소를 대신 사용하는 등 일반적인 코딩 기술을 사용하여 HTML 코드를 다시 작성하는 것이 좋습니다.