underline dotted
Konradin Breyer
- css
0 Thomas J.S.0 Konradin Breyer0 TorstenA0 Thomas J.S.0 Thomas Luethi0 Tim Tepaße0 Thomas J.S.0 wahsaga
0 e7
Hallo!
Ich möchte, dass eine underline (<u>) dotted ist.
Also habe ich folgenden Code geschrieben:
u {
border-bottom: 1px dotted;
}
Als Ergebnis bekam ich ein unterstrichenes Wort, dass nochmal mit einer dotted Linie unterstrichen war.
Wie kann ich die Unterstréichung selber dotted machen?
Freue mich auf Antwort!
Hallo,
»
Ich möchte, dass eine underline (<u>) dotted ist.
Also habe ich folgenden Code geschrieben:u {
border-bottom: 1px dotted;
}
Wie kann ich die Unterstréichung selber dotted machen?Freue mich auf Antwort!
Hallo,
.dotborder { border-bottom: 1px dotted; }
<span class="dotborder> ... </span>
Grüße
Thomas
Hallo,
.dotborder { border-bottom: 1px dotted; }
<span class="dotborder> ... </span>
Nee, dann erscheint die linie UNTER dem Text, also auch unter den g p j y q verstehst du? Eine normale underline geht durch die g p j y q...
Da gibts hoffentlich was besseres!
Gruß Konradin
Hallo,
.dotborder { border-bottom: 1px dotted; }
<span class="dotborder> ... </span>
Nee, dann erscheint die linie UNTER dem Text, also auch unter den g p j y q verstehst du?
Ja :-)
Eine normale underline geht durch die g p j y q...
Normalerweise, ja.
Da gibts hoffentlich was besseres!
Nein, du kannst den Stil der Unterstreichung selber nicht beeinflussen, entweder mit, dann durchgängig, oder ohne. Ansonsten nur mit border-bottom.
Grüße
Torsten
Danke für eure Antworten!
Es ist zwar schade, aber daran könnt Ihr ja nichts ändern.
Also denn, danke!
Hallo,
.dotborder { border-bottom: 1px dotted; }
<span class="dotborder> ... </span>
Nee, dann erscheint die linie UNTER dem Text, also auch unter den g p j y q verstehst du?
Ich nix verstehen. Du verstehen?
Eine normale underline geht durch die g p j y q...
Nein! Eine normale "underline" wird _unter_ dem Text dargestellt und geht nicht durch den Text. Das wäre <strike> oder <del>
Und jetzt sage mit bitte wo du einen Unterschied sichst (mal vom border-style abgesehen)
<body>
<u>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nullam tincidunt.<br>
Nulla sit amet urna in est gravida interdum. Aenean suscipit. <br>
Vestibulum non augue. Vivamus luctus enim ac nunc adipiscing dictum. <br>
Nunc ac lorem eget dolor aliquam laoreet. Suspendisse potenti. Fusce urna.
</u>
<br>
<br>
<span style="border-bottom:dotted 1px;">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nullam tincidunt.<br>
Nulla sit amet urna in est gravida interdum. Aenean suscipit. <br>
Vestibulum non augue. Vivamus luctus enim ac nunc adipiscing dictum. <br>
Nunc ac lorem eget dolor aliquam laoreet. Suspendisse potenti. Fusce urna.
</span>
</body>
Grüße
Thomas
Hallo, Du unglaeubiger Thomas,
Nee, dann erscheint die linie UNTER dem Text, also auch unter den g p j y q verstehst du?
Ich nix verstehen. Du verstehen?
Eine normale underline geht durch die g p j y q...
Ich verstehe sehr gut, was er meint.
Bei normaler Unterstreichung (<u> oder text-decoration:underline)
geht der Strich unmittelbar unter den meisten Buchstaben (z.B. m, n, o) durch,
die Unterlaengen (z.B. von g, p, j, y) durchschneiden den Strich.
Bei border-bottom liegt der Strich _unter_ allen Buchstaben, denn er
stellt ja die Grenze der Box dar.
Und jetzt sage mit bitte wo du einen Unterschied sichst (mal vom border-style abgesehen)
<div style="font-family:'times new roman',times,sans-serif;">
<p><u>Unterstrichen. FfJj Yy</u></p>
<p><span style="border-bottom:dotted 1px;">Border-Bottom: FfJj Yy</span></p>
<p><span style="border-bottom:dotted 1px red;"><u>Unterstrichen und Border-Bottom: FfJj Yy</u></span></p>
</div>
Wenn Du keinen Unterschied siehst
Testseite:
http://www.tiptom.ch/tests/css/underline.html
Screenshot Mozilla 1.2.1 Linux, Times New Roman (25kB)
http://www.tiptom.ch/tests/css/underline_moz121linux.png
Wenn es bei Dir anders aussieht, d.h. wenn wirklich
beide Linien auf genau der selben Hoehe liegen, schick
mir einen Screenshot mit Angaben zu OS, Browser, Font...
@Konradin: Es gibt AFAIK keine Moeglichkeit, das Aussehen
der Unterstreichungslinie zu aendern.
Aber: Unterstreichung wuerde ich sowieso nur bei Links einsetzen.
An allen anderen Orten ist es nur verwirrlich, weil die
Benutzer dann draufklicken, und nichts passiert.
Gruesse,
Thomas
Hallo,
@Konradin: Es gibt AFAIK keine Moeglichkeit, das Aussehen
der Unterstreichungslinie zu aendern.
In CSS 3 wird es das geben. Aber das dauert noch.
http://www.w3.org/TR/css3-text/#text-decoration-style
Tim
Hallo Thomas ;-)
Ich verstehe sehr gut, was er meint.
die Unterlaengen (z.B. von g, p, j, y)
Ah! Dann muss er halt sagen was er meint, "durch bei Buchstaben" heisst eben durch.
Wenn Du keinen Unterschied siehst
- hast Du eine Schriftart ohne Unterlaengen eingestellt
- hast Du eine winzige Schriftart eingestellt.
- hast Du einen komischen Browser
- ...
Alle drei: ich hatte eine kleine Schriftgröße und eine serifenlose Schrift, so dass das nciht auffiel. Und ich kenne keinen Browser der nicht komisch wäre. ;-)
@Konradin: Es gibt AFAIK keine Moeglichkeit, das Aussehen
der Unterstreichungslinie zu aendern.
Na ja ... beim dem ganz komischen Browser IE geht es schon:
(die minus margin muss man an die Schriftgröße anpassen (z.B. 18px font-size, -4px margin)
<span style="border-bottom:dotted 1px;">
<span style="margin-bottom:-4px;">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nullam tincidunt.<br />
Nulla sit amet urna in est gravida interdum. Aenean suscipit.<br />
Vestibulum non augue. Vivamus luctus enim ac nunc adipiscing dictum. <br />
Nunc ac lorem eget dolor aliquam laoreet. Suspendisse potenti. Fusce urna.
</span>
</span>
Grüße
Thomas
hi,
@Konradin: Es gibt AFAIK keine Moeglichkeit, das Aussehen
der Unterstreichungslinie zu aendern.Na ja ... beim dem ganz komischen Browser IE geht es schon:
(die minus margin muss man an die Schriftgröße anpassen (z.B. 18px font-size, -4px margin)
mit einer geeigneten kombination aus schriftgrösse, fester höhenangabe und overflow liesse sich evtl. auch was machen ...
gruss,
wahsaga
Hi,
auf die Gefahr hin, dass die Lösung schon gepostet wurde (hab mir nicht alle Antworten durchgelesen):
u {
border-bottom: 1px dotted;
text-decoration: none;
}
E7
Hallo,
hab mir nicht alle Antworten durchgelesen):
Wäre aber wirklich besser gewesen.
Denn:
a) mehr oder weniger genau das habe ich auch vorgeschlagen
b) genau die Lösung mit border ist nicht gefragt bzw. unzureichend.
Grüße
Thomas