• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Frage Nur Strich rot, nicht Wort.

P

Philipp582

Neues Mitglied
Hallo,

ich würde gerne nur den Strich rot färben und nicht den unterstrichenen Text.
Wie bekomme ich das hin, bzw. ist das überhaupt möglich?
Mein jetziger Code dafür:

u {
color: red;
font-weight: bold;
}

 
Zuletzt bearbeitet:
threadi schrieb:
Code: 
border-bottom: red;
Zum Vergrößern anklicken....
Naja.. nicht mein erwünschtes Ergebnis.
Möchte, dass der Strich nur unter meinem Wort ist.

Mein Code:
7AFyh.png
7AFyh.png

Mein Ergebnis:
 
Dann musst Du jetzt irgendetwas an deinem HTML-Code geändert haben was Du uns gerade vorenthältst. In deinem Eröffnungstopic steht etwas von einem <u>-Element im CSS-Code. Da das ein Inline-Element ist, wäre das auch das prädestinierte Element (weil es ein Inline-Element ist welches deinen Text umgibt) für die von mir vorgeschlagene CSS-Eigenschaft. Anstelle des <u> kannst Du natürlich auch jedes andere beliebige Inline-Element verwenden (wie span, i, strong ..). Wenn Du das nun fälschlicherweise der Überschrift zuordnest geht der Strich natürlich unterhalb des gesamten Block-Elements entlang.
 
Warum um alles in der Welt postest du eine Grafik von deinem Quellcode? Warum nicht den Quellcode selber?
 
Index.htm

<link href="design.css" type="text/css" rel="stylesheet" />
<html>
<head>
<meta charset="UTF-8" />
<title>*SEITE*</title>
<meta name="description" content="Kurzbeschreibung" />
<link href='*LINK*' type="text/css" rel="stylesheet"/>
</head>
<body>

<h1>Startseite</h1>

<nav>
<ul>
<li><a href="*SEITE*">Startseite</a></li>
</ul>
</nav>

</body>
</html>

Design.css

body {
background: url(*LINK*);
}
* {
padding: 0;
margin: 0;
}
nav {
background-color: black;
height: 50px;
}
nav ul {
height: 50px;
width: 450px;
}
nav ul li {
list-style-type: none;
width: 150px;
float: left;
text-align: center;
font-family: Arial;
font-size: 20px;
}
li a {
text-decoration: none;
color: white;
line-height: 50px;
display: block;
}
li a:hover {
font-weight: bold;
background-image: url(*LINK*);
}
h1 {
font-size: 26pt;
font-family: Amatic SC, cursive;
color: white;
font-size: 80px;
text-align: center;
}
h2 {
border-top: solid gray 10px;
border-left: solid gray 10px;
}
p {
text-align: center;
font-size: 40px;
font-family: Amatic SC;
color: white
}
.test {
color: red;
background-color: black;
font-weight: bolder;
}
.test2 {
background-color: yellow;


 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben