2017-02-09 9 views
2

screenshot of wrapped lines with deviant indentationhtml, Wie man es klar ausrichtet?

Ich möchte es klar aufstellen, aber ich kann es einfach nicht. Was soll ich dafür tun?

<html> 
<head> 
<style type="text/css"> 
    .article-topic-list a { 
     color: black; 
     text-decoration: none; 
     margin-left: 15px; 
     margin-top: 20px; 
    }`enter code here` 
</style> 
</head> 
<body> 
<div class="article-topic-list"> <a href="">Sale of Kodi TV boxes faces <br> legal test</a> </div> 
<div class="article-topic-list"> <a href="">Piracy fighters battle Kodi 'epidemic'</a></div> 
</body> 
</html> 

Antwort

0

Statt die CSS-Regel mit dem Tag der Anwendung, wenn Sie die Regel auf die gesamte div gelten, halte ich es für richtig ausrichten sollte. Ihr Stil Skript würde so aussehen:

<style type="text/css"> 
.article-topic-list { 
    color: black; 
    text-decoration: none; 
    margin-left: 15px; 
    margin-top: 20px; 
} 
</style> 

Und die Ausgabe so etwas wie this wäre.

1

Um die gewünschten Ergebnisse zu erhalten, müssen Sie die Randstile designgemäß in das div verschieben und die Farbe und Textdekoration auf Ihrem a-tag beibehalten. Wenn Sie einfach das 'a' aus dem style-Tag entfernen, erhalten Sie keine Farb- oder Textdekorationsänderungen, da der Stil vom Browser (direkt unter a) Vorrang haben würde.

.article-topic-list { 
 
    margin-left: 15px; 
 
    margin-top: 20px; 
 
} 
 
.article-topic-list a { 
 
    color: black; 
 
    text-decoration: none; 
 
}
<body> 
 
    <div class="article-topic-list"> 
 
    <a href="">Sale of Kodi TV boxes faces <br> legal test</a> 
 
    </div> 
 
    <div class="article-topic-list"> 
 
    <a href="">Piracy fighters battle Kodi 'epidemic'</a> 
 
    </div> 
 
</body>

dieses Beispiel.

Verwandte Themen