Welche Zeichen können für auf/ab-Dreieck (Pfeil ohne Stiel) verwendet werden, um in HTML angezeigt zu werden?

Question

Ich suche ein HTML- oder ASCII-Zeichen, das ein nach oben oder unten zeigendes Dreieck darstellt, damit ich es als Umschalter verwenden kann.

Ich habe ↑ (↑) und ↓ (↓) gefunden - aber die haben einen schmalen Stiel. Ich suche nur den HTML-Pfeil "Kopf".

Answer 1

Unicode Pfeilspitzen:

• - U+25B2 SCHWARZER AUFWÄRTSPFEIL
• - U+25BC SCHWARZER ABWÄRTSPFEIL
• - U+25B4 KLEINER SCHWARZER AUFWÄRTSPFEIL
• - U+25BE KLEINER SCHWARZER ABWÄRTSPFEIL

Für und verwenden Sie ▲ und ▼ entsprechend, wenn Sie Unicode-Zeichen nicht direkt einbinden können (verwenden Sie UTF-8!).

Beachten Sie, dass die Schriftunterstützung für die kleineren Versionen nicht so gut ist. Es ist besser, die großen Versionen in kleinerer Schrift zu verwenden.

Weitere Unicode-Pfeile finden Sie unter:

• http://en.wikipedia.org/wiki/Arrow_%28symbol%29#Arrows_in_Unicode
• http://en.wikipedia.org/wiki/Geometric_Shapes

Zuletzt sind diese Pfeile keine ASCII-Zeichen, einschließlich und : sie sind Unicode.

Answer 2

Für HTML-Entitäten
◄ = ◄
► = ►
▼ = ▼
▲ = ▲

Answer 3

Entschuldigung, aber sie sind nur in Unicode. :(

Große:

• U+25B2 (Schwarzes aufwärts zeigendes Dreieck )
• U+25BC (Schwarzes abwärts zeigendes Dreieck )
• U+25C0 (Schwarzes links zeigendes Dreieck )
• U+25B6 (Schwarzes rechts zeigendes Dreieck )

Große weiße:

• U+25B3 (Weißes aufwärts zeigendes Dreieck )
• U+25BD (Weißes abwärts zeigendes Dreieck )
• U+25C1 (Weißes links zeigendes Dreieck )
• U+25B7 (Weißes rechts zeigendes Dreieck )

Es gibt auch einige kleinere Dreiecke:

• U+25B4 (Schwarzes aufwärts zeigendes kleines Dreieck )
• U+25C2 (Schwarzes links zeigendes kleines Dreieck )
• U+25BE (Schwarzes abwärts zeigendes kleines Dreieck )
• U+25B8 (Schwarzes rechts zeigendes kleines Dreieck )

Auch einige weiße:

• U+25C3 (Weißes links zeigendes kleines Dreieck )
• U+25BF (Weißes abwärts zeigendes kleines Dreieck )
• U+25B9 (Weißes rechts zeigendes kleines Dreieck )
• U+25B5 (Weißes aufwärts zeigendes kleines Dreieck )

Es gibt auch einige "spitz zulaufende" Dreiecke. Weitere Informationen finden Sie hier in Wikipedia:
http://en.wikipedia.org/wiki/Geometric_Shapes

Aber leider sind sie alle Unicode anstelle von ASCII. Wenn Sie weiterhin ASCII verwenden möchten, können Sie eine Bilddatei dafür verwenden oder einfach ^ und v verwenden. (Genau wie bei Google Maps in der mobilen Version damit wurde auf die alte mobile Google Maps verwiesen)

---

Wie auch von anderen vorgeschlagen, können Sie Dreiecke auch mit HTML erstellen, entweder mit CSS-Rändern oder SVG-Formen oder sogar JavaScript-Leinwänden.

CSS

div{
    width: 0px;
    height: 0px;
    border-top: 10px solid black;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-bottom: none;
}

SVG

JavaScript

var ctx = document.querySelector("canvas").getContext("2d");

// do not use with() outside of this demo!
with(ctx){
    beginPath();
    moveTo(0,0);
    lineTo(16,0);
    lineTo(8,10);
    fill();
    endPath();
}

Demo

Answer 4

Im Spacing Modifier Letters Block gibt es buchstäbliche Pfeilspitzen:

U+02C2     ˂  Modifier Letter Left  Arrowhead
U+02C3     ˃  Modifier Letter Right Arrowhead
U+02C4     ˄  Modifier Letter Up    Arrowhead
U+02C5     ˅  Modifier Letter Down  Arrowhead

Answer 5

Da Sie diese Pfeile für einen Umschalter verwenden, sollten Sie möglicherweise in Betracht ziehen, diese Pfeile mit einem HTML-Element unter Verwendung der folgenden Stile anstelle von Unicode-Zeichen zu erstellen.

.upparrow {
   height: 0;
   width: 0;
   border: 4px solid transparent;
   border-bottom-color: #000;
}

.downarrow {
   height: 0;
   width: 0;
   border: 4px solid transparent;
   border-top-color: #000;
}

http://jsfiddle.net/FrsGR/