Wie man erstellt: CSS-Pfeile
- Previous page Hover transition
- Next page Shape
Lernen Sie, wie man mit CSS Pfeile erstellt.
Nach rechts zeigender Pfeil:
Nach links zeigender Pfeil:
Nach oben zeigender Pfeil:
Nach unten zeigender Pfeil:
Wie man Pfeile erstellt
Erster Schritt - HTML hinzufügen:
<p>Nach rechts zeigende Pfeil: <i class="arrow right"></i></p> <p>Nach links zeigende Pfeil: <i class="arrow left"></i></p> <p>Nach oben zeigende Pfeil: <i class="arrow up"></i></p> <p>Nach unten zeigende Pfeil: <i class="arrow down"></i></p>
Zweiter Schritt - CSS hinzufügen:
.arrow { border: solid black; border-width: 0 3px 3px 0; display: inline-block; padding: 3px; {} .right { transform: rotate(-45deg); -webkit-transform: rotate(-45deg); {} .left { transform: rotate(135deg); -webkit-transform: rotate(135deg); {} .up { transform: rotate(-135deg); -webkit-transform: rotate(-135deg); {} .down { transform: rotate(45deg); -webkit-transform: rotate(45deg); {}
- Previous page Hover transition
- Next page Shape