Austausch von Forschungserfahrungen zur Verwendung von Zeichen anstelle von abgerundeten und scharfen Ecken

Austausch von Forschungserfahrungen zur Verwendung von Zeichen anstelle von abgerundeten und scharfen Ecken

1. Die Beziehung zwischen Schriftarten und Zeichenanzeige

Die scharfen Ecken auf der linken und rechten Seite sind in der Schriftart Songti: <>
Nicht betroffen von der Schriftart: <>

Hier sind die scharfen Ecken links und rechts in der Schriftart Arial: <>
Nicht betroffen von der Schriftart: <>

Die scharfen Ecken auf der linken und rechten Seite sind in Lucida Sans Unicode: <>
Nicht betroffen von der Schriftart: <>

Die scharfen Ecken links und rechts sind hier in der Schriftart Times New Roman: <>
Nicht betroffen von der Schriftart: <>

Die scharfen Ecken auf der linken und rechten Seite sind in der Schriftart Verdana: <>
Nicht betroffen von der Schriftart: <>

Hier sind die scharfen Ecken in Auf- und Abwärtsrichtung in der Schriftart Songti mit kleinen scharfen Ecken: ˇ^
Nicht betroffen von der Schriftart: ∧∨

Hier sind die spitzen Ecken in Auf- und Abwärtsrichtung in der Schriftart Arial gehalten, mit kleinen spitzen Ecken: ˇ^
Nicht betroffen von der Schriftart: ∧∨

Die scharfen Ecken in der oberen und unteren Richtung sind in der Unicode-Schriftart Lucida Sans, kleine scharfe Ecken: ˇ^
Nicht betroffen von der Schriftart: ∧∨

Die spitzen Ecken in der oberen und unteren Richtung sind in der Schriftart Times New Roman gehalten, mit kleinen spitzen Ecken: ˇ^
Nicht betroffen von der Schriftart: ∧∨

Hier sind die scharfen Ecken in Auf- und Abwärtsrichtung in der Schriftart Verdana mit kleinen scharfen Ecken: ˇ^
Nicht betroffen von der Schriftart: ∧∨

Hier ist ein 45-Grad-Winkel, die Schriftart ist Songti:

Hier ist ein 45-Grad-Winkelkörper in der Schriftart Arial:

Hier ist ein 45-Grad-Winkel in Lucida Sans Unicode :

Hier ist ein 45-Grad-Winkel in der Schriftart Times New Roman:

Hier ist ein 45-Grad-Winkel in der Schriftart Verdana:

Hier ist eine solide scharfe Ecke, die Schriftart ist Songti: ► ◄ ▲▼

Hier ist die durchgezogene scharfe Ecke, die Schriftart ist Arial: ► ◄ ▲▼

Hier ist die durchgezogene Ecke, die Schriftart ist Lucida Sans Unicode: ► ◄ ▲▼

Hier sind die durchgezogenen scharfen Ecken, die Schriftart ist Times New Roman: ► ◄ ▲▼

Hier ist die durchgezogene scharfe Ecke, die Schriftart ist Verdana: ► ◄ ▲▼

Hier ist ein ausgefüllter Kreis. Aufgrund seiner begrenzten Größe verhält er sich wie ein sechseckiger Körper. Die Schriftart ist Songti:

Hier ist ein ausgefüllter Kreis. Aufgrund seiner begrenzten Größe verhält er sich wie ein sechseckiger Körper. Die Schriftart ist Arial:

Hier ist ein ausgefüllter Kreis. Aufgrund seiner begrenzten Größe verhält er sich wie ein sechseckiger Körper. Die Schriftart ist Lucida Sans Unicode:

Hier ist ein ausgefüllter Kreis. Aufgrund seiner begrenzten Größe verhält er sich wie ein sechseckiger Körper. Die Schriftart ist Times New Roman:

Hier ist ein ausgefüllter Kreis. Aufgrund seiner begrenzten Größe verhält er sich wie ein sechseckiger Körper. Die Schriftart ist Verdana:

Hier ist ein hohler Kreis mit der Schriftart in Songti:

Hier ist ein hohler Kreis mit der Schriftart Arial:

Hier ist ein hohler Kreis in Lucida Sans Unicode:

Hier ist ein hohler Kreis in der Schriftart Times New Roman:

Hier ist ein hohler Kreis mit der Schriftart Verdana:

Hier ist ein Viertelbogen, die Schriftart ist Songti: ╰ ╯╭ ╮

Hier ist ein Viertelkreis in der Schriftart Arial: ╰ ╯╭ ╮

Hier ist ein Viertelkreis in Lucida Sans Unicode: ╰ ╯╭ ╮

Hier ist ein Viertelkreis in Times New Roman: ╰ ╯╭ ╮

Hier ist ein Viertelbogen in Verdana: ╰ ╯╭ ╮

2. Realisieren Sie einen Viertelkreis

Füllen Sie die vier Ecken mit einem Viertelkreis, um mit der Hintergrundfarbe einen abgerundeten Eckeneffekt zu erzielen.

CSS Code:

Code kopieren
Der Code lautet wie folgt:

.quarter_round{Anzeige: Inline-Block; Breite: 8px; Höhe: 8px; Überlauf: ausgeblendet; Schriftfamilie: „宋体“;}.quarter_round span{Anzeige: Inline-Block; Schriftgröße: 16px; Zeilenhöhe: 1;}.quarter_round .lt{}.quarter_round .rt{Rand links: -7px;}.quarter_round .lb{Rand oben: -6px;}.quarter_round .rb{Rand: -6px 0 0 -7px;}

HTML Quelltext:

Code kopieren
Der Code lautet wie folgt:

&lt;span class=&quot;viertelrund&quot;&gt;&lt;span class=&quot;lt&quot;&gt;●&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;viertelrund&quot;&gt;&lt;span class=&quot;rt&quot;&gt;●&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;viertelrund&quot;&gt;&lt;span class=&quot;lb&quot;&gt;●&lt;/span&gt;&lt;/span&gt;&lt;span class=&quot;viertelrund&quot;&gt;&lt;span class=&quot;rb&quot;&gt;●&lt;/span&gt;&lt;/span&gt;

3. Realisieren Sie das abgerundete Rechteck mit einfarbigem Hintergrund

Füllen Sie die vier Ecken mit einem Viertelkreis, um mit der Hintergrundfarbe einen abgerundeten Eckeneffekt zu erzielen.

4. Implementieren Sie ein abgerundetes Rechteck mit einem festen Hintergrund und scharfen Ecken

Füllen Sie die vier Ecken mit einem Viertelkreis und fügen Sie ein Symbol mit scharfen Ecken hinzu, um ein abgerundetes Rechteck in Vollfarbe mit scharfen Ecken zu erstellen.

Füllen Sie die vier Ecken mit einem Viertelkreis und fügen Sie ein Symbol mit scharfen Ecken hinzu, um ein abgerundetes Rechteck in Vollfarbe mit scharfen Ecken zu erstellen.

5. Implementieren Sie den abgerundeten Rechteckeffekt mit doppeltem Rand und scharfen Ecken für Sina Weibo-Blogkommentare

Füllen Sie die vier Ecken mit einem Viertelkreis, wiederholen Sie dies einmal und versetzen Sie es um 1 Pixel. Fügen Sie ein Symbol mit scharfen Ecken, einen Versatz von 2 Pixeln nach oben und unten und eine rechteckige doppelschichtige Beschriftung hinzu, um den endgültigen Doppelrahmeneffekt zu erzielen.

◆ ●
Füllen Sie die vier Ecken mit einem Viertelkreis, wiederholen Sie dies einmal und versetzen Sie es um 1 Pixel. Fügen Sie ein Symbol mit scharfen Ecken, einen Versatz von 2 Pixeln nach oben und unten und eine rechteckige doppelschichtige Beschriftung hinzu, um den endgültigen Doppelrahmeneffekt zu erzielen.

<<:  javascript:void(0) Bedeutung und Anwendungsbeispiele

>>:  CSS3 zum Erreichen eines Menü-Hover-Effekts

Artikel empfehlen

So ändern Sie das MySQL-Passwort auf dem XAMPP-Server (mit Bildern)

Heute habe ich bei der Arbeit an PHP herausgefund...

Einführung und Beispiele für versteckte Felder in HTML

Grundlegende Syntax: <Eingabetyp="versteck...

Theorie: Die zwei Jahre User Experience

<br />Es ist nicht länger als zwei Jahre her...

Wir treiben IE6 alleine in den Untergang

Tatsächlich fragen wir uns jeden Tag, wann IE6 wi...

Einführung in Javascript DOM, Knoten und Elementerfassung

Inhaltsverzeichnis DOM Knoten Elementknoten: Text...

Detaillierte Beschreibung allgemeiner Ereignisse und Methoden von HTML-Text

Veranstaltungsbeschreibung onactivate: Wird ausgel...

Das native VIDEO-Tag der HTML-Seite verbirgt die Download-Button-Funktion

Beim Schreiben eines Webprojekts stieß ich auf ei...

Von CSS 3D zur räumlichen Koordinatenachse mit Quellcode

Einmal haben wir über das Würfelspiel gesprochen....

Lösung zur Verwendung der Baidu-Freigabe auf der HTTPS-Seite

Seit der Aktivierung des https-Zugriffs für die g...

So importieren Sie Tomcat-Quellcode in Idea

Inhaltsverzeichnis 1. Laden Sie den Tomcat-Code h...