Wie man ein Smiley-Gesicht-Bullet in HTML
Beliebiges Zeichen ASCII (American Standard Code for Information Interchange) – Set englische Zeichen und Extras, codiert in Zahlen – kann eine Kugel für Ihre HTML-Listen werden. Durch Standardaufzählungszeichen ausschalten und die Schaffung einer ": vor" können Sie beliebige Zeichen vor Liste platzieren Pseudoelement Elemente für den Einsatz als Aufzählungszeichen. Der Code für das Zeichen selbst benötigte nennt ein "hex-Äquivalent", die Sie in der Zeichentabelle-Anwendung in Windows finden. Das Smiley ist eines der Zeichen zur Verfügung.
Anweisungen
1 Öffnen Sie die Webseite in Notepad oder einem Codeeditor. Eine ungeordnete Liste zu erstellen:
< Ul Id = "Smiley" >#1 </li > Listenelement < li >-#2 </li > Listenelement < li >-#3 </li > Listenelement < li >-#4 </li > Listenelement < li >-</ul >
In Web-Seiten machen ungeordnete Listen Bullet-Listen. Jeden Tag "< li >" stellt ein Aufzählungselement.
2 Die "< Stil >" Tags an der Spitze Ihres HTML zu finden. Wenn nichts angezeigt wird, fügen Sie diesen Code zwischen die Tags "< Head >":
< Typ style = "Text/Css" >< / style >
3 Deaktivieren Sie den Standardaufzählungszeichen im CSS:
Smiley {} Liste-Typ: keine;}
4 Erstellen Sie ein Pseudo-Element, das Inhalt vor jedes Listenelement platziert, wo normalerweise die Kugel gehen würde:
Smiley: vor {} Inhalt: "";}
5 Fügen Sie den entflohenen hex-Wert für ein Smiley-Gesicht:
Smiley: vor {} Inhalt: "\263A";}
Hex-Werte für Sonderzeichen findet man in der Zeichentabelle in Windows. Wenn Sie auf das Smiley-Gesicht-Zeichen in der Zeichentabelle den Code "U + 263A" klicken, erscheint am unteren Rand des Bildschirms. "263A" Teil ist der hex-Code. In der Eigenschaft "Inhalt" braucht dieser hex-Code den Schrägstrich davor zu arbeiten, wie gezeigt.
6 Fügen Sie einige linken Padding um Raum zwischen den Smiley und den Text des Elements zu erstellen:
Smiley: vor {} Inhalt: "\263A";Textabstand links: 10px;}
Tipps & Warnungen
- Es gibt zwei Smileys können, wobei die erste eine Gliederung-Stil. Die hex-Code für die Version ausgefüllt ist "263B."