2017-02-04 2 views
0

Ich bin neu in HTML/CSS und ich frage mich, ob ich etwas wie eine Multi-Level-Hyperlink erstellen kann. Zum Beispiel habe ich:Muss ich beim Erstellen von Hyperlinks auf den Artikel mit der ID verweisen?

<section id="Sport"> 
    <article id="game1"> 
     <h2 class="titleheader">WHAT A GAME!</h2> 
    </article> 
    <article id="game2"> 
     <h2 class="titleheader">UNEXPECTED DRAW!</h2> 
    </article> 
</section> 

Ich möchte alle "titleheaders" etwas Styling haben. Aber gleichzeitig möchte ich den Hyperlink auf die h2 "unerwartete Ziehung" setzen. Ist es möglich, einen Hyperlink zum Klassenelement zu erstellen?

+0

'href = "# game2"' Sie die 'verwenden zu markieren: target' Selektor in CSS auch – Dev

+0

Ja, aber das wird den Link zu dem macht Artikel. Wenn etwas Text darüber wäre, würde es keinen Sinn ergeben. So verwenden Sie: Zielselektor? Ich lese MDN und verstehe es nicht. – Smorts

+0

'# game2: target' würde auf das Element zielen, wenn auf die Verknüpfung geklickt wurde. Sie können einfach eine 'id' zu' h2' hinzufügen und stattdessen – Dev

Antwort

2
<section id="Sport"> 
    <article id="game1"> 
     <h2 class="titleheader">WHAT A GAME!</h2> 
    </article> 
    <article id="game1"> 
     <h2 class="titleheader" id="unexpected-draw">UNEXPECTED DRAW!</h2> 
    </article> 
</section> 

Wenn Sie brauchen, um es verlinken:

<a href="#unexpected-draw">Link text</a> 

Wenn Sie es in CSS Ziel müssen (wenn der Link angeklickt wird, hinunter zum Kopf scrollen):

#unexpected-draw:target 

oder

h2:target 

(dies oft verwendet wird, betonen oder auf andere Weise den Header)


:target CSS selector

+0

Nun, nur '# undexpected-draw {}' würde nicht funktionieren? Wozu wird dieses Ziel benötigt? Das ist die Sache, die ich nicht verstehe. – Smorts

+0

Die [': target'] (http://www.w3schools.com/cssref/sel_target.asp) ist eine [Pseudo-Klasse] (http://www.w3schools.com/Css/css_pseudo_classes.asp). – Dev

Verwandte Themen