Możesz użyć carat „^” (czyli shift-6) i małych liter „v”, jeśli chcesz uprościć sprawę. W zależności od określonej czcionki będą wyglądać jak strzałki.
Ponadto, aby ukończyć pierwszy zestaw (góra dół lewy prawy - ▲ ▼ ◀ ▼), lewy to U + 25C0, a prawy to U + 25B6. Znalazłem je tutaj: unicode.org/charts
Nathan Long
227
„Trójkąty Unicode”. Chciałem tylko to powiedzieć ze względu na Google. :)
Nathan Long
120
Ha ha! Potrzebowałem ich ponownie i szukałem „trójkątów Unicode”. Google przywiodło mnie tutaj. Huzzah!
Nathan Long
13
Tak, chociaż ◀ / ▶ są mniej obsługiwane w czcionkach / kreacji zastępczej niż ▲ / ▼ ... zazwyczaj użytkownicy IE6 będą widzieć kwadraty. Lewe / prawe znaki „kursora” ◄ / ► są nieco szerzej obsługiwane, ale wciąż nie są tak powszechne jak góra / dół.
bobince
86
Kolejna uwaga: Aby dodać je w CSS, wystarczy użyć części numerycznej z odwrotnym ukośnikiem z przodu, tj. Przykład {content: "\ 25B2"; }
Andrew
679
Dla encji HTML
◄ = ◄
► = ►
▼ = ▼
▲ =▲
Testowałem te jednostki HTML. Mogę zgłosić, że lewa strzałka nie wyświetla się dobrze w przeglądarce Androida, ale prawa strzałka tak.
oabarca
3
@ user2070775 rzeczywiście: saucelabs.com/jobs/55afcb2086824f4c9c0c1643f2485952/... . Czcionki Droid Sans i Roboto nie mają trójkątów; Droid Serif ma te 4 (CZARNA STRZAŁKA W GÓRĘ / W DÓŁ, CZARNA STRZAŁKA W LEWO / W PRAWO); Droid Sans Fallback ma wszystkie TRÓJKĄTY CZARNY / BIAŁY W GÓRĘ / W DÓŁ / W LEWO / W PRAWO i CZARNY WSKAŹNIK W PRAWO - PUNKT - ale nie ma WSKAŹNIK W LEWO.
Beni Cherniavsky-Paskin
9
Kody ALT dla nich to (Alt + 30) ▲, (Alt + 31) ▼, (Alt + 16) ►, (Alt + 17) ◄, dla tych, którzy próbują wpisać je ręcznie.
Nate
4
Te znaki działają w IE8. Ogólnie są one bardziej spójne w różnych przeglądarkach i lepiej wyglądają w systemie Windows niż trójkąty w zaakceptowanej odpowiedzi.
Uważam, że jest to bardzo przydatne do sortowania kolumn jednoznakowych. (Wygląda dobrze przeskalowany) .
⇕ = ⇕
WAŻNA UWAGA (W przypadku używania symboli Unicode)
Obsługa Unicode różni się w zależności od wybranego symbolu, przeglądarki i rodziny czcionek. Jeśli stwierdzisz, że wybrany symbol nie działa w niektórych przeglądarkach, spróbuj użyć innej rodziny czcionek. Microsoft zaleca "Segoe UI Symbol"jednak umieszczenie czcionki w swojej witrynie, ponieważ niewiele osób ma ją na swoich komputerach.
Otwórz tę stronę w innych przeglądarkach, aby zobaczyć, które symbole są renderowane za pomocą domyślnej czcionki.
Więcej strzał w Unicode.
Możesz je skopiować bezpośrednio ze strony poniżej lub użyć kodu.
Każdy rząd strzałek jest ponumerowany od lewej do prawej:
0,1,2,3,4,5,6,7,8,9,A,B,C,D,E,F
Po prostu wstaw odpowiedni numer / literę przed średnikiem zamykającym, jak powyżej.
ș
← ↑ → ↓ ↔ ↕ ↖ ↗ ↘ ↙ ↚ ↛ ↜ ↝ ↞ ↟
Ț
↠ ↡ ↢ ↣ ↤ ↥ ↦ ↧ ↨ ↩ ↪ ↫ ↬ ↭ ↮ ↯
ț
↰ ↱ ↲ ↳ ↴ ↵ ↶ ↷ ↸ ↹ ↺ ↻ ↼ ↽ ↾ ↿
Ȝ
⇀ ⇁ ⇂ ⇃ ⇄ ⇅ ⇆ ⇇ ⇈ ⇉ ⇊ ⇋ ⇌ ⇍ ⇎ ⇏
ȝ
⇐ ⇑ ⇒ ⇓ ⇔ ⇕ ⇖ ⇗ ⇘ ⇙ ⇚ ⇛ ⇜ ⇝ ⇞ ⇟
Ȟ
⇠ ⇡ ⇢ ⇣ ⇤ ⇥ ⇦ ⇧ ⇨ ⇩ ⇪ ⇫ ⇬ ⇭ ⇮ ⇯
ȟ
⇰ ⇱ ⇲ ⇳ ⇴ ⇵ ⇶ ⇷ ⇸ ⇹ ⇺ ⇻ ⇼ ⇽ ⇾ ⇿
Dodatkowe symbole Unicode HTML
Wybrana lista innych pomocnych ikon / symboli Unicode.
U+2302⌂ HOUSE
U+2303⌃ UP ARROWHEAD
U+2304⌄ DOWN ARROWHEAD
U+2305⌅ PROJECTIVE
U+2306⌆ PERSPECTIVE
U+2307⌇ WAVY LINE
U+2315⌕ TELEPHONE RECORDER
U+2316⌖ POSITION INDICATOR
U+2317⌗ VIEWDATA SQUARE
U+2318⌘ PLACE OF INTEREST SIGN
U+231A⌚ WATCH
U+231B⌛ HOURGLASS
U+2326⌦ ERASE TO THE RIGHT
U+2327⌧ X IN A RECTANGLE BOX
U+2328⌨ KEYBOARD
U+2329〈 LEFT-POINTING ANGLE BRACKET
U+232A〉 RIGHT-POINTING ANGLE BRACKET
U+232B⌫ ERASE TO THE LEFT
U+23E9⏩ BLACK RIGHT-POINTING DOUBLE TRIANGLE
U+23EA⏪ BLACK LEFT-POINTING DOUBLE TRIANGLE
U+23EB⏫ BLACK UP-POINTING DOUBLE TRIANGLE
U+23EC⏬ BLACK DOWN-POINTING DOUBLE TRIANGLE
U+23ED⏭ BLACK RIGHT-POINTING DOUBLE TRIANGLE WITH VERTICAL BAR
U+23EE⏮ BLACK LEFT-POINTING DOUBLE TRIANGLE WITH VERTICAL BAR
U+23EF⏯ BLACK RIGHT-POINTING TRIANGLE WITH DOUBLE VERTICAL BAR
U+23F0⏰ ALARM CLOCK
U+23F1⏱ STOPWATCH
U+23F2⏲ TIMER CLOCK
U+23F3⏳ HOURGLASS WITH FLOWING SAND
U+2600☀ BLACK SUN WITH RAYS
U+2601☁ CLOUD
U+2602☂ UMBRELLA
U+2603☃ SNOWMAN
U+2604☄ COMET
U+2605★ BLACK STAR
U+2606☆ WHITE STAR
U+2607☇ LIGHTNING
U+2608☈ THUNDERSTORM
U+2609☉ SUN
U+260A☊ ASCENDING NODE
U+260B☋ DESCENDING NODE
U+260C☌ CONJUNCTION
U+260D☍ OPPOSITION
U+260E☎ BLACK TELEPHONE
U+260F☏ WHITE TELEPHONE
U+2610☐ BALLOT BOX
U+2611☑ BALLOT BOX WITH CHECK
U+2612☒ BALLOT BOX WITH X
U+2613☓ SALTIRE
U+2614☔ UMBRELLA WITH RAINDROPS
U+2615☕ HOT BEVERAGE
U+2616☖ WHITE SHOGI PIECE
U+2617☗ BLACK SHOGI PIECE
U+2618☘ SHAMROCK
U+2619☙ REVERSED ROTATED FLORAL HEART BULLET
U+261A☚ BLACK LEFT-POINTING INDEX
U+261B☛ BLACK RIGHT-POINTING INDEX
U+261C☜ WHITE LEFT POINTING INDEX
U+261D☝ WHITE UP POINTING INDEX
U+261E☞ WHITE RIGHT POINTING INDEX
U+261F☟ WHITE DOWN POINTING INDEX
U+2620☠ SKULL AND CROSSBONES
U+2621☡ CAUTION SIGN
U+2622☢ RADIOACTIVE SIGN
U+2623☣ BIOHAZARD SIGN
U+262A☪ STAR AND CRESCENT
U+262B☫ FARSI SYMBOL
U+262C☬ ADI SHAKTI
U+262D☭ HAMMER AND SICKLE
U+262E☮ PEACE SYMBOL
U+262F☯ YIN YANG
U+2638☸ WHEEL OF DHARMA
U+2639☹ WHITE FROWNING FACE
U+263A☺ WHITE SMILING FACE
U+263B☻ BLACK SMILING FACE
U+263C☼ WHITE SUN WITH RAYS
U+263D☽ FIRST QUARTER MOON
U+263E☾ LAST QUARTER MOON
U+263F☿ MERCURY
U+2640♀ FEMALE SIGN
U+2641♁ EARTH
U+2642♂ MALE SIGN
U+2643♃ JUPITER
U+2644♄ SATURN
U+2645♅ URANUS
U+2646♆ NEPTUNE
U+2647♇ PLUTO
U+2648♈ ARIES
U+2649♉ TAURUS
U+264A♊ GEMINI
U+264B♋ CANCER
U+264C♌ LEO
U+264D♍ VIRGO
U+264E♎ LIBRA
U+264F♏ SCORPIUS
U+2650♐ SAGITTARIUS
U+2651♑ CAPRICORN
U+2652♒ AQUARIUS
U+2653♓ PISCES
U+2654♔ WHITE CHESS KING
U+2655♕ WHITE CHESS QUEEN
U+2656♖ WHITE CHESS ROOK
U+2657♗ WHITE CHESS BISHOP
U+2658♘ WHITE CHESS KNIGHT
U+2659♙ WHITE CHESS PAWN
U+265A♚ BLACK CHESS KING
U+265B♛ BLACK CHESS QUEEN
U+265C♜ BLACK CHESS ROOK
U+265D♝ BLACK CHESS BISHOP
U+265E♞ BLACK CHESS KNIGHT
U+265F♟ BLACK CHESS PAWN
U+2660♠ BLACK SPADE SUIT
U+2661♡ WHITE HEART SUIT
U+2662♢ WHITE DIAMOND SUIT
U+2663♣ BLACK CLUB SUITE
U+2664♤ WHITE SPADE SUIT
U+2665♥ BLACK HEART SUIT
U+2666♦ BLACK DIAMOND SUIT
U+2667♧ WHITE CLUB SUITE
U+2668♨ HOT SPRINGS
U+2669♩ QUARTER NOTE
U+266A♪ EIGHTH NOTE
U+266B♫ BEAMED EIGHTH NOTES
U+266C♬ BEAMED SIXTEENTH NOTES
U+266D♭ MUSIC FLAT SIGN
U+266E♮ MUSIC NATURAL SIGN
U+266F♯ MUSIC SHARP SIGN
U+267A♺ RECYCLING SYMBOL FOR GENERIC MATERIALS
U+267B♻ BLACK UNIVERSAL RECYCLING SYMBOL
U+267C♼ RECYCLED PAPER SYMBOL
U+267D♽ PARTIALLY-RECYCLED PAPER SYMBOL
U+267E♾ PERMANENT PAPER SIGN
U+267F♿ WHEELCHAIR SYMBOL
U+2680⚀ DIE FACE-1
U+2681⚁ DIE FACE-2
U+2682⚂ DIE FACE-3
U+2683⚃ DIE FACE-4
U+2684⚄ DIE FACE-5
U+2685⚅ DIE FACE-6
U+2686⚆ WHITE CIRCLE WITH DOT RIGHT
U+2687⚇ WHITE CIRCLE WITH TWO DOTS
U+2688⚈ BLACK CIRCLE WITH WHITE DOT RIGHT
U+2689⚉ BLACK CIRCLE WITH TWO WHITE DOTS
U+268A⚊ MONOGRAM FOR YANG
U+268B⚋ MONOGRAM FOR YIN
U+268C⚌ DIGRAM FOR GREATER YANG
U+268D⚍ DIGRAM FOR LESSER YIN
U+268E⚎ DIGRAM FOR LESSER YANG
U+268F⚏ DIGRAM FOR GREATER YIN
U+2690⚐ WHITE FLAG
U+2691⚑ BLACK FLAG
U+2692⚒ HAMMER AND PICK
U+2693⚓ ANCHOR
U+2694⚔ CROSSED SWORDS
U+2695⚕ STAFF OF AESCULAPIUS
U+2696⚖ SCALES
U+2697⚗ ALEMBIC
U+2698⚘ FLOWER
U+2699⚙ GEAR
U+269A⚚ STAFF OF HERMES
U+269B⚛ ATOM SYMBOL
U+269C⚜ FLEUR-DE-LIS
U+269D⚝ OUTLINED WHITE STAR
U+269E⚞ THREE LINES CONVERGING RIGHT
U+269F⚟ THREE LINES CONVERGING LEFT
U+26A0⚠ WARNING SIGN
U+26A1⚡ HIGH VOLTAGE SIGN
U+26A2⚢ DOUBLED FEMALE SIGN
U+26A3⚣ DOUBLED MALE SIGN
U+26A4⚤ INTERLOCKED FEMALE AND MALE SIGN
U+26A5⚥ MALE AND FEMALE SIGN
U+26A6⚦ MALE WITH STROKE SIGN
U+26A7⚧ MALE WITH STROKE AND MALE AND FEMALE SIGN
U+26A8⚨ VERTICAL MALE WITH STROKE SIGN
U+26A9⚩ HORIZONTAL MALE WITH STROKE SIGN
U+26AA⚪ MEDIUM WHITE CIRCLE
U+26AB⚫ MEDIUM BLACK CIRCLE
U+26BD⚽ SOCCER BALL
U+26BE⚾ BASEBALL
U+26BF⚿ SQUARED KEY
U+26C0⛀ WHITE DRAUGHTSMAN
U+26C1⛁ WHITE DRAUGHTS KING
U+26C2⛂ BLACK DRAUGHTSMAN
U+26C3⛃ BLACK DRAUGHTS KING
U+26C4⛄ SNOWMAN WITHOUT SNOW
U+26C5⛅ SUN BEHIND CLOUD
U+26C6⛆ RAIN
U+26C7⛇ BLACK SNOWMAN
U+26C8⛈ THUNDER CLOUD AND RAIN
U+26C9⛉ TURNED WHITE SHOGI PIECE
U+26CA⛊ TURNED BLACK SHOGI PIECE
U+26CB⛋ WHITE DIAMOND IN SQUARE
U+26CC⛌ CROSSING LANES
U+26CD⛍ DISABLED CAR
U+26CE⛎ OPHIUCHUS
U+26CF⛏ PICK
U+26D0⛐ CAR SLIDING
U+26D1⛑ HELMET WITH WHITE CROSS
U+26D2⛒ CIRCLED CROSSING LANES
U+26D3⛓ CHAINS
U+26D4⛔ NO ENTRY
U+26D5⛕ ALTERNATE ONE-WAY LEFT WAY TRAFFIC
U+26D6⛖ BLACK TWO-WAY LEFT WAY TRAFFIC
U+26D7⛗ WHITE TWO-WAY LEFT WAY TRAFFIC
U+26D8⛘ BLACK LEFT LANE MERGE
U+26D9⛙ WHITE LEFT LANE MERGE
U+26DA⛚ DRIVE SLOW SIGN
U+26DB⛛ HEAVY WHITE DOWN-POINTING TRIANGLE
U+26DC⛜ LEFT CLOSED ENTRY
U+26DD⛝ SQUARED SALTIRE
U+26DE⛞ FALLING DIAGONAL IN WHITE CIRCLE IN BLACK SQUARE
U+26DF⛟ BLACK TRUCK
U+26E0⛠ RESTRICTED LEFT ENTRY-1
U+26E1⛡ RESTRICTED LEFT ENTRY-2
U+26E2⛢ ASTRONOMICAL SYMBOL FOR URANUS
U+26E3⛣ HEAVY CIRCLE WITH STROKE AND TWO DOTS ABOVE
U+26E4⛤ PENTAGRAM
U+26E5⛥ RIGHT-HANDED INTERLACED PENTAGRAM
U+26E6⛦ LEFT-HANDED INTERLACED PENTAGRAM
U+26E7⛧ INVERTED PENTAGRAM
U+26E8⛨ BLACK CROSS ON SHIELD
U+26E9⛩ SHINTO SHRINE
U+26EA⛪ CHURCH
U+26EB⛫ CASTLE
U+26EC⛬ HISTORIC SITE
U+26ED⛭ GEAR WITHOUT HUB
U+26EE⛮ GEAR WITH HANDLES
U+26EF⛯ MAP SYMBOL FOR LIGHTHOUSE
U+26F0⛰ MOUNTAIN
U+26F1⛱ UMBRELLA ON GROUND
U+26F2⛲ FOUNTAIN
U+26F3⛳ FLAG IN HOLE
U+26F4⛴ FERRY
U+26F5⛵ SAILBOAT
U+26F6⛶ SQUARE FOUR CORNERS
U+26F7⛷ SKIER
U+26F8⛸ ICE SKATE
U+26F9⛹ PERSON WITH BALL
U+26FA⛺ TENT
U+26FD⛽ FUEL PUMP
U+26FE⛾ CUP ON BLACK SQUARE
U+26FF⛿ WHITE FLAG WITH HORIZONTAL MIDDLE BLACK STRIPE
U+2701✁ UPPER BLADE SCISSORS
U+2702✂ BLACK SCISSORS
U+2703✃ LOWER BLADE SCISSORS
U+2704✄ WHITE SCISSORS
U+2705✅ WHITE HEAVY CHECK MARK
U+2706✆ TELEPHONE LOCATION SIGN
U+2707✇ TAPE DRIVE
U+2708✈ AIRPLANE
U+2709✉ ENVELOPE
U+270A✊ RAISED FIST
U+270B✋ RAISED HAND
U+270C✌ VICTORY HAND
U+270D✍ WRITING HAND
U+270E✎ LOWER RIGHT PENCIL
U+270F✏ PENCIL
U+2710✐ UPPER RIGHT PENCIL
U+2711✑ WHITE NIB
U+2712✒ BLACK NIB
U+2713✓ CHECK MARK
U+2714✔ HEAVY CHECK MARK
U+2715✕ MULTIPLICATION X
U+2716✖ HEAVY MULTIPLICATION X
U+2717✗ BALLOT X
U+2718✘ HEAVY BALLOT X
U+2719✙ OUTLINED GREEK CROSS
U+271A✚ HEAVY GREEK CROSS
U+271B✛ OPEN CENTRE CROSS
U+271C✜ HEAVY OPEN CENTRE CROSS
U+271D✝ LATIN CROSS
U+271E✞ SHADOWED WHITE LATIN CROSS
U+271F✟ OUTLINED LATIN CROSS
U+2720✠ MALTESE CROSS
U+2721✡ STAR OF DAVID
U+2722✢ FOUR TEARDROP-SPOKED ASTERISK
U+2723✣ FOUR BALLOON-SPOKED ASTERISK
U+2724✤ HEAVY FOUR BALLOON-SPOKED ASTERISK
U+2725✥ FOUR CLUB-SPOKED ASTERISK
U+2726✦ BLACK FOUR POINTED STAR
U+2727✧ WHITE FOUR POINTED STAR
U+2728✨ SPARKLES
U+2729✩ STRESS OUTLINED WHITE STAR
U+272A✪ CIRCLED WHITE STAR
U+272B✫ OPEN CENTRE BLACK STAR
U+272C✬ BLACK CENTRE WHITE STAR
U+272D✭ OUTLINED BLACK STAR
U+272E✮ HEAVY OUTLINED BLACK STAR
U+272F✯ PINWHEEL STAR
U+2730✰ SHADOWED WHITE STAR
U+2731✱ HEAVY ASTERISK
U+2732✲ OPEN CENTRE ASTERISK
U+2733✳ EIGHT SPOKED ASTERISK
U+2734✴ EIGHT POINTED BLACK STAR
U+2735✵ EIGHT POINTED PINWHEEL STAR
U+2736✶ SIX POINTED BLACK STAR
U+2737✷ EIGHT POINTED RECTILINEAR BLACK STAR
U+2738✸ HEAVY EIGHT POINTED RECTILINEAR BLACK STAR
U+2739✹ TWELVE POINTED BLACK STAR
U+273A✺ SIXTEEN POINTED ASTERISK
U+273B✻ TEARDROP-SPOKED ASTERISK
U+273C✼ OPEN CENTRE TEARDROP-SPOKED ASTERISK
U+273D✽ HEAVY TEARDROP-SPOKED ASTERISK
U+273E✾ SIX PETALLED BLACK AND WHITE FLORETTE
U+273F✿ BLACK FLORETTE
U+2740❀ WHITE FLORETTE
U+2741❁ EIGHT PETALLED OUTLINED BLACK FLORETTE
U+2742❂ CIRCLED OPEN CENTRE EIGHT POINTED STAR
U+2743❃ HEAVY TEARDROP-SPOKED PINWHEEL ASTERISK
U+2744❄ SNOWFLAKE
U+2745❅ TIGHT TRIFOLIATE SNOWFLAKE
U+2746❆ HEAVY CHEVRON SNOWFLAKE
U+2747❇ SPARKLE
U+2748❈ HEAVY SPARKLE
U+2749❉ BALLOON-SPOKED ASTERISK
U+274A❊ EIGHT TEARDROP-SPOKED PROPELLER ASTERISK
U+274B❋ HEAVY EIGHT TEARDROP-SPOKED PROPELLER ASTERISK
U+274C❌ CROSS MARK
U+274D❍ SHADOWED WHITE CIRCLE
U+274E❎ NEGATIVE SQUARED CROSS MARK
U+2753❓ BLACK QUESTION MARK ORNAMENT
U+2754❔ WHITE QUESTION MARK ORNAMENT
U+2755❕ WHITE EXCLAMATION MARK ORNAMENT
U+2756❖ BLACK DIAMOND MINUS WHITE X
U+2757❗ HEAVY EXCLAMATION MARK SYMBOL
U+275B❛ HEAVY SINGLE TURNED COMMA QUOTATION MARK ORNAMENT
U+275C❜ HEAVY SINGLE COMMA QUOTATION MARK ORNAMENT
U+275D❝ HEAVY DOUBLE TURNED COMMA QUOTATION MARK ORNAMENT
U+275E❞ HEAVY DOUBLE COMMA QUOTATION MARK ORNAMENT
U+275F❟ HEAVY LOW SINGLE COMMA QUOTATION MARK ORNAMENT
U+2760❠ HEAVY LOW DOUBLE COMMA QUOTATION MARK ORNAMENT
U+2761❡ CURVED STEM PARAGRAPH SIGN ORNAMENT
U+2762❢ HEAVY EXCLAMATION MARK ORNAMENT
U+2763❣ HEAVY HEART EXCLAMATION MARK ORNAMENT
U+2764❤ HEAVY BLACK HEART
U+2765❥ ROTATED HEAVY BLACK HEART BULLET
U+2766❦ FLORAL HEART
U+2767❧ ROTATED FLORAL HEART BULLET
U+276C❬ MEDIUM LEFT-POINTING ANGLE BRACKET ORNAMENT
U+276D❭ MEDIUM RIGHT-POINTING ANGLE BRACKET ORNAMENT
U+276E❮ HEAVY LEFT-POINTING ANGLE QUOTATION MARK ORNAMENT
U+276F❯ HEAVY RIGHT-POINTING ANGLE QUOTATION MARK ORNAMENT
U+2770❰ HEAVY LEFT-POINTING ANGLE BRACKET ORNAMENT
U+2771❱ HEAVY RIGHT-POINTING ANGLE BRACKET ORNAMENT
U+2794➔ HEAVY WIDE-HEADED RIGHTWARDS ARROW
U+2795➕ HEAVY PLUS SIGN
U+2796➖ HEAVY MINUS SIGN
U+2797➗ HEAVY DIVISION SIGN
U+2798➘ HEAVY SOUTH EAST ARROW
U+2799➙ HEAVY RIGHTWARDS ARROW
U+279A➚ HEAVY NORTH EAST ARROW
U+279B➛ DRAFTING POINT RIGHTWARDS ARROW
U+279C➜ HEAVY ROUND-TIPPED RIGHTWARDS ARROW
U+279D➝ TRIANGLE-HEADED RIGHTWARDS ARROW
U+279E➞ HEAVY TRIANGLE-HEADED RIGHTWARDS ARROW
U+279F➟ DASHED TRIANGLE-HEADED RIGHTWARDS ARROW
U+27A0➠ HEAVY DASHED TRIANGLE-HEADED RIGHTWARDS ARROW
U+27A1➡ BLACK RIGHTWARDS ARROW
U+27A2➢ THREE-D TOP-LIGHTED RIGHTWARDS ARROWHEAD
U+27A3➣ THREE-D BOTTOM-LIGHTED RIGHTWARDS ARROWHEAD
U+27A4➤ BLACK RIGHTWARDS ARROWHEAD
U+27A5➥ HEAVY BLACK CURVED DOWNWARDS AND RIGHTWARDS ARROW
U+27A6➦ HEAVY BLACK CURVED UPWARDS AND RIGHTWARDS ARROW
U+27A7➧ SQUAT BLACK RIGHTWARDS ARROW
U+27A8➨ HEAVY CONCAVE-POINTED BLACK RIGHTWARDS ARROW
U+27A9➩ RIGHT-SHADED WHITE RIGHTWARDS ARROW
U+27AA➪ LEFT-SHADED WHITE RIGHTWARDS ARROW
U+27AB➫ BACK-TILTED SHADOWED WHITE RIGHTWARDS ARROW
U+27AC➬ FRONT-TILTED SHADOWED WHITE RIGHTWARDS ARROW
U+27AD➭ HEAVY LOWER RIGHT-SHADOWED WHITE RIGHTWARDS ARROW
U+27AE➮ HEAVY UPPER RIGHT-SHADOWED WHITE RIGHTWARDS ARROW
U+27AF➯ NOTCHED LOWER RIGHT-SHADOWED WHITE RIGHTWARDS ARROW
U+27B0➰ CURLY LOOP
U+27B1➱ NOTCHED UPPER RIGHT-SHADOWED WHITE RIGHTWARDS ARROW
U+27B2➲ CIRCLED HEAVY WHITE RIGHTWARDS ARROW
U+27B3➳ WHITE-FEATHERED RIGHTWARDS ARROW
U+27B4➴ BLACK-FEATHERED SOUTH EAST ARROW
U+27B5➵ BLACK-FEATHERED RIGHTWARDS ARROW
U+27B6➶ BLACK-FEATHERED NORTH EAST ARROW
U+27B7➷ HEAVY BLACK-FEATHERED SOUTH EAST ARROW
U+27B8➸ HEAVY BLACK-FEATHERED RIGHTWARDS ARROW
U+27B9➹ HEAVY BLACK-FEATHERED NORTH EAST ARROW
U+27BA➺ TEARDROP-BARBED RIGHTWARDS ARROW
U+27BB➻ HEAVY TEARDROP-SHANKED RIGHTWARDS ARROW
U+27BC➼ WEDGE-TAILED RIGHTWARDS ARROW
U+27BD➽ HEAVY WEDGE-TAILED RIGHTWARDS ARROW
U+27BE➾ OPEN-OUTLINED RIGHTWARDS ARROW
U+27C0⟀ THREE DIMENSIONAL ANGLE
U+27E8⟨ MATHEMATICAL LEFT ANGLE BRACKET
U+27E9⟩ MATHEMATICAL RIGHT ANGLE BRACKET
U+27EA⟪ MATHEMATICAL LEFT DOUBLE ANGLE BRACKET
U+27EB⟫ MATHEMATICAL RIGHT DOUBLE ANGLE BRACKET
U+27F0⟰ UPWARDS QUADRUPLE ARROW
U+27F1⟱ DOWNWARDS QUADRUPLE ARROW
U+27F2⟲ ANTICLOCKWISE GAPPED CIRCLE ARROW
U+27F3⟳ CLOCKWISE GAPPED CIRCLE ARROW
U+27F4⟴ RIGHT ARROW WITH CIRCLED PLUS
U+27F5⟵ LONG LEFTWARDS ARROW
U+27F6⟶ LONG RIGHTWARDS ARROW
U+27F7⟷ LONG LEFT RIGHT ARROW
U+27F8⟸ LONG LEFTWARDS DOUBLE ARROW
U+27F9⟹ LONG RIGHTWARDS DOUBLE ARROW
U+27FA⟺ LONG LEFT RIGHT DOUBLE ARROW
U+27FB⟻ LONG LEFTWARDS ARROW FROM BAR
U+27FC⟼ LONG RIGHTWARDS ARROW FROM BAR
U+27FD⟽ LONG LEFTWARDS DOUBLE ARROW FROM BAR
U+27FE⟾ LONG RIGHTWARDS DOUBLE ARROW FROM BAR
U+27FF⟿ LONG RIGHTWARDS SQUIGGLE ARROW
U+2900⤀ RIGHTWARDS TWO-HEADED ARROW WITH VERTICAL STROKE
U+2901⤁ RIGHTWARDS TWO-HEADED ARROW WITH DOUBLE VERTICAL STROKE
U+2902⤂ LEFTWARDS DOUBLE ARROW WITH VERTICAL STROKE
U+2903⤃ RIGHTWARDS DOUBLE ARROW WITH VERTICAL STROKE
U+2904⤄ LEFT RIGHT DOUBLE ARROW WITH VERTICAL STROKE
U+2905⤅ RIGHTWARDS TWO-HEADED ARROW FROM BAR
U+2906⤆ LEFTWARDS DOUBLE ARROW FROM BAR
U+2907⤇ RIGHTWARDS DOUBLE ARROW FROM BAR
U+2908⤈ DOWNWARDS ARROW WITH HORIZONTAL STROKE
U+2909⤉ UPWARDS ARROW WITH HORIZONTAL STROKE
U+290A⤊ UPWARDS TRIPLE ARROW
U+290B⤋ DOWNWARDS TRIPLE ARROW
U+290C⤌ LEFTWARDS DOUBLE DASH ARROW
U+290D⤍ RIGHTWARDS DOUBLE DASH ARROW
U+290E⤎ LEFTWARDS TRIPLE DASH ARROW
U+290F⤏ RIGHTWARDS TRIPLE DASH ARROW
U+2910⤐ RIGHTWARDS TWO-HEADED TRIPLE DASH ARROW
U+2911⤑ RIGHTWARDS ARROW WITH DOTTED STEM
U+2912⤒ UPWARDS ARROW TO BAR
U+2913⤓ DOWNWARDS ARROW TO BAR
U+2914⤔ RIGHTWARDS ARROW WITH TAIL WITH VERTICAL STROKE
U+2915⤕ RIGHTWARDS ARROW WITH TAIL WITH DOUBLE VERTICAL STROKE
U+2916⤖ RIGHTWARDS TWO-HEADED ARROW WITH TAIL
U+2917⤗ RIGHTWARDS TWO-HEADED ARROW WITH TAIL WITH VERTICAL STROKE
U+2918⤘ RIGHTWARDS TWO-HEADED ARROW WITH TAIL WITH DOUBLE VERTICAL STROKE
U+2919⤙ LEFTWARDS ARROW-TAIL
U+291A⤚ RIGHTWARDS ARROW-TAIL
U+291B⤛ LEFTWARDS DOUBLE ARROW-TAIL
U+291C⤜ RIGHTWARDS DOUBLE ARROW-TAIL
U+291D⤝ LEFTWARDS ARROW TO BLACK DIAMOND
U+291E⤞ RIGHTWARDS ARROW TO BLACK DIAMOND
U+291F⤟ LEFTWARDS ARROW FROM BAR TO BLACK DIAMOND
U+2920⤠ RIGHTWARDS ARROW FROM BAR TO BLACK DIAMOND
U+2921⤡ NORTHWEST AND SOUTH EAST ARROW
U+2922⤢ NORTHEAST AND SOUTH WEST ARROW
U+2923⤣ NORTH WEST ARROW WITH HOOK
U+2924⤤ NORTH EAST ARROW WITH HOOK
U+2925⤥ SOUTH EAST ARROW WITH HOOK
U+2926⤦ SOUTH WEST ARROW WITH HOOK
U+2927⤧ NORTH WEST ARROW AND NORTH EAST ARROW
U+2928⤨ NORTH EAST ARROW AND SOUTH EAST ARROW
U+2929⤩ SOUTH EAST ARROW AND SOUTH WEST ARROW
U+292A⤪ SOUTH WEST ARROW AND NORTH WEST ARROW
U+292B⤫ RISING DIAGONAL CROSSING FALLING DIAGONAL
U+292C⤬ FALLING DIAGONAL CROSSING RISING DIAGONAL
U+292D⤭ SOUTH EAST ARROW CROSSING NORTH EAST ARROW
U+292E⤮ NORTH EAST ARROW CROSSING SOUTH EAST ARROW
U+292F⤯ FALLING DIAGONAL CROSSING NORTH EAST ARROW
U+2930⤰ RISING DIAGONAL CROSSING SOUTH EAST ARROW
U+2931⤱ NORTH EAST ARROW CROSSING NORTH WEST ARROW
U+2932⤲ NORTH WEST ARROW CROSSING NORTH EAST ARROW
U+2933⤳ WAVE ARROW POINTING DIRECTLY RIGHT
U+2934⤴ ARROW POINTING RIGHTWARDS THEN CURVING UPWARDS
U+2935⤵ ARROW POINTING RIGHTWARDS THEN CURVING DOWNWARDS
U+2936⤶ ARROW POINTING DOWNWARDS THEN CURVING LEFTWARDS
U+2937⤷ ARROW POINTING DOWNWARDS THEN CURVING RIGHTWARDS
U+2938⤸ RIGHT-SIDE ARC CLOCKWISE ARROW
U+2939⤹ LEFT-SIDE ARC ANTICLOCKWISE ARROW
U+293A⤺ TOP ARC ANTICLOCKWISE ARROW
U+293B⤻ BOTTOM ARC ANTICLOCKWISE ARROW
U+293C⤼ TOP ARC CLOCKWISE ARROW WITH MINUS
U+293D⤽ TOP ARC ANTICLOCKWISE ARROW WITH PLUS
U+293E⤾ LOWER RIGHT SEMICIRCULAR CLOCKWISE ARROW
U+293F⤿ LOWER LEFT SEMICIRCULAR ANTICLOCKWISE ARROW
U+2940⥀ ANTICLOCKWISE CLOSED CIRCLE ARROW
U+2941⥁ CLOCKWISE CLOSED CIRCLE ARROW
U+2942⥂ RIGHTWARDS ARROW ABOVE SHORT LEFTWARDS ARROW
U+2943⥃ LEFTWARDS ARROW ABOVE SHORT RIGHTWARDS ARROW
U+2944⥄ SHORT RIGHTWARDS ARROW ABOVE LEFTWARDS ARROW
U+2945⥅ RIGHTWARDS ARROW WITH PLUS BELOW
U+2946⥆ LEFTWARDS ARROW WITH PLUS BELOW
U+2962⥢ LEFTWARDS HARPOON WITH BARB UP ABOVE LEFTWARDS HARPOON WITH BARB DOWN
U+2963⥣ UPWARDS HARPOON WITH BARB LEFT BESIDE UPWARDS HARPOON WITH BARB RIGHT
U+2964⥤ RIGHTWARDS HARPOON WITH BARB UP ABOVE RIGHTWARDS HARPOON WITH BARB DOWN
U+2965⥥ DOWNWARDS HARPOON WITH BARB LEFT BESIDE DOWNWARDS HARPOON WITH BARB RIGHT
U+2966⥦ LEFTWARDS HARPOON WITH BARB UP ABOVE RIGHTWARDS HARPOON WITH BARB UP
U+2967⥧ LEFTWARDS HARPOON WITH BARB DOWN ABOVE RIGHTWARDS HARPOON WITH BARB DOWN
U+2968⥨ RIGHTWARDS HARPOON WITH BARB UP ABOVE LEFTWARDS HARPOON WITH BARB UP
U+2969⥩ RIGHTWARDS HARPOON WITH BARB DOWN ABOVE LEFTWARDS HARPOON WITH BARB DOWN
U+296A⥪ LEFTWARDS HARPOON WITH BARB UP ABOVE LONG DASH
U+296B⥫ LEFTWARDS HARPOON WITH BARB DOWN BELOW LONG DASH
U+296C⥬ RIGHTWARDS HARPOON WITH BARB UP ABOVE LONG DASH
U+296D⥭ RIGHTWARDS HARPOON WITH BARB DOWN BELOW LONG DASH
U+296E⥮ UPWARDS HARPOON WITH BARB LEFT BESIDE DOWNWARDS HARPOON WITH BARB RIGHT
U+296F⥯ DOWNWARDS HARPOON WITH BARB LEFT BESIDE UPWARDS HARPOON WITH BARB RIGHT
U+2989⦉ Z NOTATION LEFT BINDING BRACKET
U+298A⦊ Z NOTATION RIGHT BINDING BRACKET
U+2991⦑ LEFT ANGLE BRACKET WITH DOT
U+2992⦒ RIGHT ANGLE BRACKET WITH DOT
U+2993⦓ LEFT ARC LESS-THAN BRACKET
U+2994⦔ RIGHT ARC GREATER-THAN BRACKET
U+2995⦕ DOUBLE LEFT ARC GREATER-THAN BRACKET
U+2996⦖ DOUBLE RIGHT ARC LESS-THAN BRACKET
U+29A8⦨ MEASURED ANGLE WITH OPEN ARM ENDING IN ARROW POINTING UP AND RIGHT
U+29A9⦩ MEASURED ANGLE WITH OPEN ARM ENDING IN ARROW POINTING UP AND LEFT
U+29AA⦪ MEASURED ANGLE WITH OPEN ARM ENDING IN ARROW POINTING DOWN AND RIGHT
U+29AB⦫ MEASURED ANGLE WITH OPEN ARM ENDING IN ARROW POINTING DOWN AND LEFT
U+29AC⦬ MEASURED ANGLE WITH OPEN ARM ENDING IN ARROW POINTING RIGHT AND UP
U+29AD⦭ MEASURED ANGLE WITH OPEN ARM ENDING IN ARROW POINTING LEFT AND UP
U+29AE⦮ MEASURED ANGLE WITH OPEN ARM ENDING IN ARROW POINTING RIGHT AND DOWN
U+29AF⦯ MEASURED ANGLE WITH OPEN ARM ENDING IN ARROW POINTING LEFT AND DOWN
U+29BE⦾ CIRCLED WHITE BULLET
U+29BF⦿ CIRCLED BULLET
U+29C9⧉ TWO JOINED SQUARES
U+29CE⧎ RIGHT TRIANGLE ABOVE LEFT TRIANGLE
U+29CF⧏ LEFT TRIANGLE BESIDE VERTICAL BAR
U+29D0⧐ VERTICAL BAR BESIDE RIGHT TRIANGLE
U+29D1⧑ BOWTIE WITH LEFT HALF BLACK
U+29D2⧒ BOWTIE WITH RIGHT HALF BLACK
U+29D3⧓ BLACK BOWTIE
U+29D4⧔ TIMES WITH LEFT HALF BLACK
U+29D5⧕ TIMES WITH RIGHT HALF BLACK
U+29D6⧖ WHITE HOURGLASS
U+29D7⧗ BLACK HOURGLASS
U+29E8⧨ DOWN-POINTING TRIANGLE WITH LEFT HALF BLACK
U+29E9⧩ DOWN-POINTING TRIANGLE WITH RIGHT HALF BLACK
U+29EA⧪ BLACK DIAMOND WITH DOWN ARROW
U+29EB⧫ BLACK LOZENGE
U+29EC⧬ WHITE CIRCLE WITH DOWN ARROW
U+29ED⧭ BLACK CIRCLE WITH DOWN ARROW
U+29F4⧴ RULE-DELAYED
U+29FC⧼ LEFT-POINTING CURVED ANGLE BRACKET
U+29FD⧽ RIGHT-POINTING CURVED ANGLE BRACKET
U+29FE⧾ TINY
U+29FF⧿ MINY
U+2B00⬀ NORTH EAST WHITE ARROW
U+2B01⬁ NORTH WEST WHITE ARROW
U+2B02⬂ SOUTH EAST WHITE ARROW
U+2B03⬃ SOUTH WEST WHITE ARROW
U+2B04⬄ LEFT RIGHT WHITE ARROW
U+2B05⬅ LEFTWARDS BLACK ARROW
U+2B06⬆ UPWARDS BLACK ARROW
U+2B07⬇ DOWNWARDS BLACK ARROW
U+2B08⬈ NORTH EAST BLACK ARROW
U+2B09⬉ NORTH WEST BLACK ARROW
U+2B0A⬊ SOUTH EAST BLACK ARROW
U+2B0B⬋ SOUTHWEST BLACK ARROW
U+2B0C⬌ LEFT RIGHT BLACK ARROW
U+2B0D⬍ UP DOWN BLACK ARROW
U+2B0E⬎ RIGHTWARDS ARROW WITH TIP DOWNWARDS
U+2B0F⬏ RIGHTWARDS ARROW WITH TIP UPWARDS
U+2B10⬐ LEFTWARDS ARROW WITH TIP DOWNWARDS
U+2B11⬑ LEFTWARDS ARROW WITH TIP UPWARDS
U+2B12⬒ SQUARE WITH TOP HALF BLACK
U+2B13⬓ SQUARE WITH BOTTOM HALF BLACK
U+2B14⬔ SQUARE WITH UPPER RIGHT DIAGONAL HALF BLACK
U+2B15⬕ SQUARE WITH LOWER LEFT DIAGONAL HALF BLACK
U+2B16⬖ DIAMOND WITH LEFT HALF BLACK
U+2B17⬗ DIAMOND WITH RIGHT HALF BLACK
U+2B18⬘ DIAMOND WITH TOP HALF BLACK
U+2B19⬙ DIAMOND WITH BOTTOM HALF BLACK
U+2B1A⬚ DOTTED SQUARE
U+2B1B⬛ BLACK LARGE SQUARE
U+2B1C⬜ WHITE LARGE SQUARE
U+2B1D⬝ BLACK VERY SMALL SQUARE
U+2B1E⬞ WHITE VERY SMALL SQUARE
U+2B1F⬟ BLACK PENTAGON
U+2B20⬠ WHITE PENTAGON
U+2B21⬡ WHITE HEXAGON
U+2B22⬢ BLACK HEXAGON
U+2B23⬣ HORIZONTAL BLACK HEXAGON
U+2B24⬤ BLACK LARGE CIRCLE
U+2B25⬥ BLACK MEDIUM DIAMOND
U+2B26⬦ WHITE MEDIUM DIAMOND
U+2B27⬧ BLACK MEDIUM LOZENGE
U+2B28⬨ WHITE MEDIUM LOZENGE
U+2B29⬩ BLACK SMALL DIAMOND
U+2B2A⬪ BLACK SMALL LOZENGE
U+2B2B⬫ WHITE SMALL LOZENGE
U+2B30⬰ LEFT ARROW WITH SMALL CIRCLE
U+2B31⬱ THREE LEFTWARDS ARROWS
U+2B32⬲ LEFT ARROW WITH CIRCLED PLUS
U+2B33⬳ LONG LEFTWARDS SQUIGGLE ARROW
U+2B34⬴ LEFTWARDS TWO-HEADED ARROW WITH VERTICAL STROKE
U+2B35⬵ LEFTWARDS TWO-HEADED ARROW WITH DOUBLE VERTICAL STROKE
U+2B36⬶ LEFTWARDS TWO-HEADED ARROW FROM BAR
U+2B37⬷ LEFTWARDS TWO-HEADED TRIPLE DASH ARROW
U+2B38⬸ LEFTWARDS ARROW WITH DOTTED STEM
U+2B39⬹ LEFTWARDS ARROW WITH TAIL WITH VERTICAL STROKE
U+2B3A⬺ LEFTWARDS ARROW WITH TAIL WITH DOUBLE VERTICAL STROKE
U+2B3B⬻ LEFTWARDS TWO-HEADED ARROW WITH TAIL
U+2B3C⬼ LEFTWARDS TWO-HEADED ARROW WITH TAIL WITH VERTICAL STROKE
U+2B3D⬽ LEFTWARDS TWO-HEADED ARROW WITH TAIL WITH DOUBLE VERTICAL STROKE
U+2B3E⬾ LEFTWARDS ARROW THROUGH X
U+2B3F⬿ WAVE ARROW POINTING DIRECTLY LEFT
U+2B40⭀ EQUALS SIGN ABOVE LEFTWARDS ARROW
U+2B41⭁ REVERSE TILDE OPERATOR ABOVE LEFTWARDS ARROW
U+2B42⭂ LEFTWARDS ARROW ABOVE REVERSE ALMOST EQUAL TO
U+2B43⭃ RIGHTWARDS ARROW THROUGH GREATER-THAN
U+2B44⭄ RIGHTWARDS ARROW THROUGH SUPERSET
U+2B45⭅ LEFTWARDS QUADRUPLE ARROW
U+2B46⭆ RIGHTWARDS QUADRUPLE ARROW
U+2B47⭇ REVERSE TILDE OPERATOR ABOVE RIGHTWARDS ARROW
U+2B48⭈ RIGHTWARDS ARROW ABOVE REVERSE ALMOST EQUAL TO
U+2B49⭉ TILDE OPERATOR ABOVE LEFTWARDS ARROW
U+2B4A⭊ LEFTWARDS ARROW ABOVE ALMOST EQUAL TO
U+2B4B⭋ LEFTWARDS ARROW ABOVE REVERSE TILDE OPERATOR
U+2B4C⭌ RIGHTWARDS ARROW ABOVE REVERSE TILDE OPERATOR
U+2B50⭐ WHITE MEDIUM STAR
U+2B51⭑ BLACK SMALL STAR
U+2B52⭒ WHITE SMALL STAR
U+2B53⭓ BLACK RIGHT-POINTING PENTAGON
U+2B54⭔ WHITE RIGHT-POINTING PENTAGON
U+2B55⭕ HEAVY LARGE CIRCLE
U+2B56⭖ HEAVY OVAL WITH OVAL INSIDE
U+2B57⭗ HEAVY CIRCLE WITH CIRCLE INSIDE
U+2B58⭘ HEAVY CIRCLE
U+2B59⭙ HEAVY CIRCLED SALTIRE
OPCJA 2: CZYSTE CHEWRONY CSS
Niedawno napisałem artykuł na temat wydajnego tworzenia szewronów przy użyciu tylko CSS (bez obrazów).
.Chevron{position:relative;display:block;height:50px;/*height should be double border*/}.Chevron:before,.Chevron:after{position:absolute;display:block;content:"";border:25px solid transparent;/*adjust size*/}/* Replace all text `top` below with left/right/bottom to rotate the chevron */.Chevron:before{top:0;border-top-color:#b00;/*Chevron Color*/}.Chevron:after{top:-10px;/*adjust thickness*/border-top-color:#fff;/*Match background colour*/}
Nie trzeba dołączać dodatkowych zasobów w postaci obrazów lub czcionek.
Obsługuje pełną przezroczystość alfa.
Pełna obsługa różnych przeglądarek.
Małe obrazy / ikony mogą być przechowywane w bazie danych.
CONS
Aktualizacja / edycja może być kłopotliwa.
Nie nadaje się do dużych obrazów ze względu na generowane nadmierne znaczniki kodu.
CSS
.sorting,.sorting_asc,.sorting_desc{
padding:4px21px4px4px;
cursor:pointer;}.sorting{
background:url(data:image/gif;base64,R0lGODlhCwALAJEAAAAAAP///xUVFf///yH5BAEAAAMALAAAAAALAAsAAAIUnC2nKLnT4or00PvyrQwrPzUZshQAOw==) no-repeat center right;}.sorting_asc{
background:url(data:image/gif;base64,R0lGODlhCwALAJEAAAAAAP///xUVFf///yH5BAEAAAMALAAAAAALAAsAAAIRnC2nKLnT4or00Puy3rx7VQAAOw==) no-repeat center right;}.sorting_desc{
background:url(data:image/gif;base64,R0lGODlhCwALAJEAAAAAAP///xUVFf///yH5BAEAAAMALAAAAAALAAsAAAIPnI+py+0/hJzz0IruwjsVADs=) no-repeat center right;}
Strzałki Unicode ⇫i powyżej wyglądają dobrze w FF i IE, ale nie wyświetlają się w Chrome.
Landed Delikatnie
@LandedGently Obsługa Unicode różni się w zależności od przeglądarki, jednak jeśli spróbujesz wyświetlić inną czcionkę, na przykład „Segoe UI Symbol”, rozsądnie byłoby dołączyć czcionkę do swojej witryny. Otwórz tę stronę w innych przeglądarkach, aby zobaczyć, które symbole są renderowane za pomocą domyślnej czcionki.
DreamTeK,
283
Przepraszamy, ale są one tylko w standardzie Unicode. :(
Ale niestety wszystkie są Unicode zamiast ASCII. Jeśli nadal chcesz używać ASCII, możesz użyć do tego pliku obrazu tylko do użycia ^i v. ( Podobnie jak Mapy Google w wersji mobilnej dotyczyło to starożytnych Map Google na telefony komórkowe)
Jak sugerowali również inni, możesz również tworzyć trójkąty z HTML, albo z ramkami CSS lub kształtami SVG, a nawet płótnami 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();}
Dziwne, że nie są symetryczne. (Przynajmniej w Chrome na OSX)
Drew LeSueur
2
Jak mieć te symbole w Windows CE?
utvecklare
4
Kody ALT dla pierwszego zestawu to (Alt + 30) ▲, (Alt + 31) ▼, (Alt + 16) ►, (Alt + 17) ◄, dla tych, którzy próbują wpisać je ręcznie.
Nate
2
@Nate - Czy są dla systemu Mac OS? Ponieważ nie działają dla mnie w systemie Windows.
Derek 朕 會 功夫
2
Właśnie tego użyłem, aby uzyskać je w Visual Studio, i to, jak wpisałem je tutaj w komentarzu. Windows 7. Może nie jest uniwersalny (choć tak myślałem). Być może używana czcionka nie obsługuje tych znaków.
Nate
93
Ponieważ używasz tych strzałek do przełączania przełączników, możesz rozważyć utworzenie tych strzałek z elementem HTML za pomocą następujących stylów zamiast znaków Unicode.
Cztery granice kwadratowego elementu spotykają się pod kątem 45 °, więc tylko zabarwiając jedną z granic, powstaje trójkąt. Możesz zobaczyć przykład tutaj: jsfiddle.net/FrsGR
Magnus Magnusson
2
Powinienem dodać, że spotykają się pod kątem 45 °, kiedy wszystkie są takie same. Zmieniając szerokość ramek sąsiadujących z kolorową ramką, możesz zmienić kąt.
Magnus Magnusson
3
PS: Zazwyczaj używa się ich :afterdo tworzenia bąbelków dialogowych.
Derek 朕 會 功夫
6
Należy jednak zauważyć, że używanie granic do tworzenia trójkątów ma szerszą obsługę przeglądarki niż pseudoelement: after.
Magnus Magnusson
2
Zajęło mi trochę czasu, aby dowiedzieć się, jak to działa. Dodałem tło: czerwony do .arrow w skrzypcach dla momentu „ah-ha”
Jak wspomniano, nie działa to dla wszystkich kodowań stron. Nie jestem pewien, dlaczego OP po prostu nie opublikował ich jako dziesiętnych, które działałyby niezależnie od kodowania. Użyj & # 708; i & # 709;
Lev
1
Wyglądają zupełnie inaczej na Debianie (mały i przesunięty do góry) i Windows (duży i wyśrodkowany pionowo).
pomimo
19
Istnieje kilka prawidłowych sposobów wyświetlania trójkąta skierowanego w dół.
Metoda 1: użyj dziesiętnej encji HTML
HTML:
▼
Metoda 2: użyj szesnastkowej encji HTML
HTML:
▼
Metoda 3: użyj znaku bezpośrednio
HTML:
▼
Metoda 4: użyj CSS
HTML:
<spanclass='icon-down'></span>
CSS:
.icon-down:before {
content:"\25BC";}
Każda z tych trzech metod powinna mieć takie same wyniki. Dla innych symboli istnieją te same trzy opcje. Niektóre mają nawet czwartą opcję, pozwalającą na użycie referencji opartej na łańcuchach znaków (np. ♥Do wyświetlenia ♥).
Możesz skorzystać z referencyjnej witryny internetowej, takiej jak Unicode-table.com, aby dowiedzieć się, które ikony są obsługiwane w UNICODE i z którymi kodami odpowiadają. Na przykład wartości trójkąta skierowanego w dół znajdują się na stronie http://unicode-table.com/en/25BC/ .
Pamiętaj, że te metody są wystarczające tylko dla ikon, które są domyślnie dostępne w każdej przeglądarce. W przypadku symboli takich jak ☃, ❄, ★, ☂, ☭, ⎗ lub ⎘ jest to znacznie mniej prawdopodobne. Chociaż możliwe jest zapewnienie obsługi w różnych przeglądarkach innych symboli UNICODE, procedura jest nieco bardziej skomplikowana.
Zupełnie inną strategią jest użycie obrazów tła zamiast czcionek. Aby uzyskać optymalną wydajność, najlepiej osadzić obraz w pliku CSS przez kodowanie podstawowe, jak wspomniano np. @ weasel5i2 i @Obsidian. Poleciłbym raczej użycie SVG niż GIF-a, ale jest to lepsze zarówno pod względem wydajności, jak i ostrości symboli.
W wielu przypadkach zastosowania obrazy tła i czcionki ikon oparte na SVG są w dużej mierze równoważne pod względem wydajności i elastyczności. Aby zdecydować, który wybrać, rozważ następujące różnice:
Obrazy SVG
Mogą mieć wiele kolorów
Mogą osadzać własny CSS i / lub być stylizowane przez dokument HTML
Mogą być ładowane jako osobny plik, osadzone w CSS ORAZ osadzone w HTML
Każdy symbol jest reprezentowany przez kod XML lub kod base64. Nie można użyć znaku bezpośrednio w edytorze kodu ani encji HTML
Wielokrotne użycie tego samego symbolu oznacza duplikację symbolu, gdy kod XML jest osadzony w kodzie HTML. Powielanie nie jest wymagane przy osadzaniu pliku w CSS lub ładowaniu go jako osobnego pliku
Nie można używać color, font-size, line-height, background-colorlub inne zasady stylizacji czcionek związanych zmienić wyświetlanie ikonę, ale można odwoływać się różne komponenty ikonę jako kształtów indywidualnie.
Potrzebujesz wiedzy na temat kodowania SVG i / lub base64
Ograniczone lub brak wsparcia w starych wersjach IE
Czcionki ikon
Ikona może mieć tylko jeden kolor wypełnienia, jeden kolor tła itp.
Ikona może być osadzona w CSS lub HTML. W HTML możesz użyć znaku bezpośrednio lub użyć encji HTML, aby go reprezentować.
Niektóre symbole mogą być wyświetlane bez użycia strony internetowej. Większość symboli nie może.
Wielokrotne użycie tego samego symbolu oznacza duplikację symbolu, gdy twoja postać jest osadzona w HTML. Powielanie nie jest wymagane przy osadzaniu pliku w CSS.
Można użyć color, font-size, line-height, background-colorlub inne zasady stylizacji czcionek związanych zmienić wyświetlanie ikonę
Nie potrzebujesz specjalnej wiedzy technicznej
Obsługa wszystkich głównych przeglądarek, w tym starych wersji IE
Osobiście polecam stosowanie tła obrazów tylko wtedy, kiedy trzeba wiele kolorów i tych kolorów nie można osiągnąć za pomocą color, background-colori innych reguł CSS związane z kolorami dla czcionek.
Główną zaletą korzystania z obrazów SVG jest to, że można nadać różnym komponentom symbolu własną stylizację. Jeśli osadzisz kod SVG XML w dokumencie HTML, jest to bardzo podobne do stylu HTML. Spowodowałoby to jednak powstanie strony internetowej, która używa zarówno tagów HTML, jak i SVG, co może znacznie zmniejszyć czytelność strony internetowej. Dodaje również dodatkowe wzdęcia, jeśli symbol jest powtarzany na wielu stronach i należy wziąć pod uwagę, że stare wersje IE nie obsługują SVG lub mają ograniczone wsparcie.
Chociaż znaki te nie są zdefiniowane w American Standard Code for Information Interchange jako glify, ich kody WERE były powszechnie używane do przedstawienia graficznej kodów ASCII 24 i 25 (hex 18 i 19, CANcel i EM: End of Medium). Strona kodowa 437 (zwana przez IBM rozszerzonym ASCII, zawiera kody numeryczne od 128 do 255) definiuje użycie tych glifów jako kodów ASCII, a wszechobecność tych konwencji przeniknęła branżę, co widać po ich wdrożeniu jako standardów przez wiodące firmy, takie jak HP, szczególnie dla drukarek i IBM, szczególnie dla mikrokomputerów, począwszy od oryginalnego komputera.
Podobnie jak użycie kodów ASCII dla CAN i EM było wówczas stosunkowo przestarzałe, co uzasadnia ich użycie jako glifów, tak upływ czasu sprawił, że użycie kodów jako glifów stało się przestarzałe w związku z obecnym stosowaniem konwencji UNICODE.
Należy podkreślić, że rozszerzenia ASCII wykonane przez IBM w rozszerzonym ASCII obejmowały nie tylko większy zestaw liczb dla kodów numerycznych od 128 do 255, ale także rozszerzyły zastosowanie niektórych numerycznych kodów sterujących, w zakresie ASCII od 0 do 32, od tylko protokoły sterowania transmisją mediów zawierające glify. Często niepoprawnie zakłada się, że pierwsze 0 do 128 nie były „rozszerzone” i że IBM używał glifów konwencjonalnego ASCII dla tego zakresu. Ten błąd występuje również w jednym z poprzednich odniesień. Ten błąd stał się tak powszechny, że kolokwialnie na nowo zdefiniował ASCII podprogowo.
Dobra odpowiedź informacyjna, jednak uważam, że Timj poprosił o alternatywy dla ↑ / ↓.
David Hogue,
13
Wiem, że jestem spóźniony na imprezę, ale możesz to zrobić również za pomocą zwykłego CSS:
HTML:
(Może to być dowolny element HTML, jeśli używasz elementu wbudowanego, takiego jak <span>na przykład, upewnij się, że jest to element blokowy / element wbudowany blokowy za pomocą display:block;lub display:inline-block) :
Możesz to również zrobić za pomocą :beforei:after pseudo-elementy, które w rzeczywistości jest lepszy sposób, ponieważ można uniknąć tworzenia dodatkowych znaczników. Ale to zależy od tego, jak chcesz to osiągnąć.
Chociaż miło jest móc to zrobić w czystym CSS, istnieją pewne problemy, takie jak brak obsługi cieniowania w Firefox lub IE, po zmarnowanych godzinach wracam do strzałek Unicode
direct00
@ direct00 Brakuje Ci sensu. Jeśli wiesz, że projektujesz strzały w określony sposób, od razu wiesz, która metoda jest najlepsza dla twoich potrzeb. Jeśli zmarnowałeś swój czas, to nie jest mój problem, tylko twój. I nie ma takiej potrzeby. Powodzenia.
Ricardo Zea,
11
Wiele osób sugeruje użycie trójkątów, ale czasami potrzebujesz szewronu.
Mieliśmy przypadek, w którym nasz przycisk pokazuje szewron, i chcieliśmy, aby instrukcja użytkownika odnosiła się do przycisku w sposób, który zostanie rozpoznany przez użytkownika nietechnicznego. Potrzebowaliśmy więc znaku szewronu.
W końcu użyliśmy ﹀. Jest znany jako FORMULARZ PREZENTACJI DLA PIONOWEGO WSPORNIKA KĄTA PRAWEGO, a jego kod to U + FE40.
Zwykle najlepiej jest zobaczyć postać w jej kontekście.
Oto pełna lista znaków Unicode oraz sposób ich wyświetlania w przeglądarce. Ta lista ewoluuje, wersje przeglądarek po innych.
Ta lista jest uzyskiwana przez iterację dziesiętną tabeli Unicode encji HTML, może to zająć kilka sekund, ale w wielu przypadkach jest bardzo przydatne.
Po najechaniu kursorem na dany znak otrzymasz dec i hex oraz skróty do wygenerowania go za pomocą klawiatury.
var i =0do document.write("<a title='(Linux|Hex): [CTRL+SHIFT]+u"+(i).toString(16)+"\nHtml entity: &# "+i+";\n&#x"+(i).toString(16)+";\n(Win|Dec): [ALT]+"+i+"' onmouseover='this.focus()' onclick='this.href=\"//google.com/?q=\"+this.innerHTML' style='cursor:pointer' target='new'>"+"&#"+i+";</a>"),i++while(i<136690)
window.stop()// From https://codepen.io/Nico_KraZhtest/pen/mWzXqy
To wygląda na pomocne. Czy wiesz, jak powiedzieć, czy Unicode 10 jest obsługiwany w niektórych przeglądarkach? Sprawdziłem caniuse.com/#search=unicode%2010 , ale wydawało się , że to nie mówi.
Ryan
1
Trudno powiedzieć. W przypadku przeglądarki wolnej od linuksa, takiej jak chrom, nie jest ona dostępna od razu, ale możemy zainstalować dodatkowe czcionki. Najbardziej kompletna jest prawdopodobnie emojione: github.com/emojione/emojione
NVRM
10
Elementy HTML dla pustych trójkątów
◁ = ◁
▷ = ▷
▽ = ▽
△ =△
Myślę, że pytający może odnosić się do jednego z nich (patrz załączony obraz) - sam znalazłem to pytanie StackOverflow, szukając tego samego.
Niestety, ten glif nigdzie nie istnieje jako odrębna postać. Wikipedia osiąga to poniżej, używając wbudowanego javascript i img content = "data: image / gif ...", aby uzyskać symbol.
Ups, właśnie zauważyłem, że pytający powiedział „w górę LUB w dół”, więc nieważne, ale niektórym może się to przydać w pewnym stopniu przydatne
weasel5i2
2
Opcja base64 jest dobrym dodatkiem do tego wątku. Dobry.
DreamTeK,
2
Chociaż ciąg base64 dla prostego gif jest zbyt długi. Ive skompresował ostrzejszy obraz base64 tej samej ikony do 70 znaków. Dodałem to do mojej powyższej odpowiedzi.
DreamTeK,
1
Czy można dostosować kolor?
Hlung
5
Ten wydaje się sugerować, że 030 i 031 są trójkątami w górę iw dół.
(Jak zauważył Bobin, nie wydaje się to standardem ASCII)
pracuje dla mnie. ... Link, a nie znaki; to jest strona kodowa 437 , wcale nie ASCII. 437 to stara strona kodowa DOS, której nie można używać w przeglądarkach.
bobince
2
Właśnie próbowałem „ALT- [NUMPAD 3] - [NUMPAD 1]” i otrzymałem: ▼ (OS to Windows XP SP3, przeglądarka to Firefox 3.6 (?)).
FrustratedWithFormsDesigner
4
Używam ▼ i ▲, ale mogą one nie działać dla Ciebie. Używam alt 11551 dla pierwszego i 11550 dla drugiego. Zawsze możesz skopiować i wkleić je, jeśli ascii nie jest takie samo dla twojego systemu.
Zdecydowałem, że najbardziej popularne symbole zalecane tutaj (▼ i ▲) wyglądają zbyt odważnie, więc na stronie codepoints.net, zalecanej przez użytkownika ADJenks, znalazłem te symbole, które wyglądają lepiej na mój gust: 🞀 (U + 1F780) 🞁 (U + 1F781) 🞂 (U + 1F782) 🞃 (U + 1F783)
Ma kilka dopasowań do „strzały w kształcie trójkąta”, które mają łodygi, ale są to tylko 4 małe strony do przejrzenia i istnieje wiele dobrych dopasowań z ładnymi szczegółami dla każdej postaci.
Odpowiedzi:
Głowice strzałek Unicode:
Do użycia ▲ i ▼
▲
i▼
odpowiednio, jeśli nie możesz bezpośrednio dołączyć znaków Unicode (użyj UTF-8!).Pamiętaj, że obsługa czcionek w mniejszych wersjach nie jest tak dobra. Lepiej używać dużych wersji mniejszą czcionką.
Więcej strzałek Unicode znajduje się na:
Wreszcie, te strzałki nie są ASCII, w tym ↑ i ↓: są to Unicode.
źródło
Dla encji HTML
◄ =
◄
► =
►
▼ =
▼
▲ =
▲
źródło
OPCJA 1: UNICODE COLUMN SORT STRZAŁKI
Uważam, że jest to bardzo przydatne do sortowania kolumn jednoznakowych. (Wygląda dobrze przeskalowany) .
⇕
= ⇕WAŻNA UWAGA (W przypadku używania symboli Unicode)
Obsługa Unicode różni się w zależności od wybranego symbolu, przeglądarki i rodziny czcionek. Jeśli stwierdzisz, że wybrany symbol nie działa w niektórych przeglądarkach, spróbuj użyć innej rodziny czcionek. Microsoft zaleca
"Segoe UI Symbol"
jednak umieszczenie czcionki w swojej witrynie, ponieważ niewiele osób ma ją na swoich komputerach.Otwórz tę stronę w innych przeglądarkach, aby zobaczyć, które symbole są renderowane za pomocą domyślnej czcionki.
Więcej strzał w Unicode.
Możesz je skopiować bezpośrednio ze strony poniżej lub użyć kodu.
Każdy rząd strzałek jest ponumerowany od lewej do prawej:
Po prostu wstaw odpowiedni numer / literę przed średnikiem zamykającym, jak powyżej.
ș
← ↑ → ↓ ↔ ↕ ↖ ↗ ↘ ↙ ↚ ↛ ↜ ↝ ↞ ↟
Ț
↠ ↡ ↢ ↣ ↤ ↥ ↦ ↧ ↨ ↩ ↪ ↫ ↬ ↭ ↮ ↯
ț
↰ ↱ ↲ ↳ ↴ ↵ ↶ ↷ ↸ ↹ ↺ ↻ ↼ ↽ ↾ ↿
Ȝ
⇀ ⇁ ⇂ ⇃ ⇄ ⇅ ⇆ ⇇ ⇈ ⇉ ⇊ ⇋ ⇌ ⇍ ⇎ ⇏
ȝ
⇐ ⇑ ⇒ ⇓ ⇔ ⇕ ⇖ ⇗ ⇘ ⇙ ⇚ ⇛ ⇜ ⇝ ⇞ ⇟
Ȟ
⇠ ⇡ ⇢ ⇣ ⇤ ⇥ ⇦ ⇧ ⇨ ⇩ ⇪ ⇫ ⇬ ⇭ ⇮ ⇯
ȟ
⇰ ⇱ ⇲ ⇳ ⇴ ⇵ ⇶ ⇷ ⇸ ⇹ ⇺ ⇻ ⇼ ⇽ ⇾ ⇿
Dodatkowe symbole Unicode HTML
Wybrana lista innych pomocnych ikon / symboli Unicode.
OPCJA 2: CZYSTE CHEWRONY CSS
Niedawno napisałem artykuł na temat wydajnego tworzenia szewronów przy użyciu tylko CSS (bez obrazów).
Jak po prostu zmienić:
CLICK FOR DEMO ON JSFIDDLE
CSS (Wydajny z obsługą wielu przeglądarek)
OPCJA 3: IKONY PODSTAWY CSS64
GÓRA DÓŁ
NA DÓŁ
W GÓRĘ
Używając tylko kilku linii CSS, możemy zakodować nasze obrazy do base64.
CLICK FOR DEMO ON JSFIDDLE
PROS
CONS
CSS
źródło
⇫
i powyżej wyglądają dobrze w FF i IE, ale nie wyświetlają się w Chrome.Przepraszamy, ale są one tylko w standardzie Unicode. :(
Duże:
U+25B2
(Czarny trójkąt skierowany w górę ▲)U+25BC
(Czarny trójkąt skierowany w dół ▼)U+25C0
(Czarny trójkąt skierowany w lewo ◀)U+25B6
(Czarny trójkąt skierowany w prawo ▶)Duże białe:
U+25B3
(Biały trójkąt skierowany w górę △)U+25BD
(Biały trójkąt skierowany w dół ▽)U+25C1
(Biały trójkąt skierowany w lewo ◁)U+25B7
(Biały trójkąt skierowany w prawo ▷)Istnieje również kilka mniejszych trójkątów:
U+25B4
(Czarny mały trójkąt skierowany w górę ▴)U+25C2
(Czarny mały trójkąt skierowany w lewo ◂)U+25BE
(Czarny mały trójkąt skierowany w dół ▾)U+25B8
(Czarny mały trójkąt skierowany w prawo ▸)Również niektóre białe:
U+25C3
(Biały mały trójkąt skierowany w lewo ◃)U+25BF
(Biały mały trójkąt skierowany w dół ▿)U+25B9
(Biały mały trójkąt skierowany w prawo ▹)U+25B5
(Biały mały trójkąt skierowany w górę ▵)Istnieją również „spiczaste” trójkąty. Możesz przeczytać więcej tutaj w Wikipedii:
http://en.wikipedia.org/wiki/Geometric_Shapes
Ale niestety wszystkie są Unicode zamiast ASCII. Jeśli nadal chcesz używać ASCII, możesz użyć do tego pliku obrazu tylko do użycia
^
iv
. (Podobnie jak Mapy Google w wersji mobilnejdotyczyło to starożytnych Map Google na telefony komórkowe)Jak sugerowali również inni, możesz również tworzyć trójkąty z HTML, albo z ramkami CSS lub kształtami SVG, a nawet płótnami JavaScript.
CSS
SVG
JavaScript
Próbny
źródło
Ponieważ używasz tych strzałek do przełączania przełączników, możesz rozważyć utworzenie tych strzałek z elementem HTML za pomocą następujących stylów zamiast znaków Unicode.
http://jsfiddle.net/FrsGR/
źródło
:after
do tworzenia bąbelków dialogowych.W bloku Listy modyfikatora odstępów znajdują się dosłowne groty strzałek :
źródło
˄
lub dziesiętny˄
. Ale jeśli dobrze kodujesz swoje strony, powinieneś po prostu móc je skopiować i wkleić do dokumentu.Istnieje kilka prawidłowych sposobów wyświetlania trójkąta skierowanego w dół.
Metoda 1: użyj dziesiętnej encji HTML
HTML:
Metoda 2: użyj szesnastkowej encji HTML
HTML:
Metoda 3: użyj znaku bezpośrednio
HTML:
Metoda 4: użyj CSS
HTML:
CSS:
Każda z tych trzech metod powinna mieć takie same wyniki. Dla innych symboli istnieją te same trzy opcje. Niektóre mają nawet czwartą opcję, pozwalającą na użycie referencji opartej na łańcuchach znaków (np.
♥
Do wyświetlenia ♥).Możesz skorzystać z referencyjnej witryny internetowej, takiej jak Unicode-table.com, aby dowiedzieć się, które ikony są obsługiwane w UNICODE i z którymi kodami odpowiadają. Na przykład wartości trójkąta skierowanego w dół znajdują się na stronie http://unicode-table.com/en/25BC/ .
Pamiętaj, że te metody są wystarczające tylko dla ikon, które są domyślnie dostępne w każdej przeglądarce. W przypadku symboli takich jak ☃, ❄, ★, ☂, ☭, ⎗ lub ⎘ jest to znacznie mniej prawdopodobne. Chociaż możliwe jest zapewnienie obsługi w różnych przeglądarkach innych symboli UNICODE, procedura jest nieco bardziej skomplikowana.
Jeśli chcesz wiedzieć, jak dodać obsługę mniej popularnych znaków UNICODE, zobacz Tworzenie strony internetowej za pomocą symboli Unicode Supplementary Multilingual Plane, aby uzyskać więcej informacji na ten temat.
Obrazy tła
Zupełnie inną strategią jest użycie obrazów tła zamiast czcionek. Aby uzyskać optymalną wydajność, najlepiej osadzić obraz w pliku CSS przez kodowanie podstawowe, jak wspomniano np. @ weasel5i2 i @Obsidian. Poleciłbym raczej użycie SVG niż GIF-a, ale jest to lepsze zarówno pod względem wydajności, jak i ostrości symboli.
Poniższy kod jest wersją base64 i SVG ikony:
Kiedy używać obrazów tła lub czcionek
W wielu przypadkach zastosowania obrazy tła i czcionki ikon oparte na SVG są w dużej mierze równoważne pod względem wydajności i elastyczności. Aby zdecydować, który wybrać, rozważ następujące różnice:
Obrazy SVG
color
,font-size
,line-height
,background-color
lub inne zasady stylizacji czcionek związanych zmienić wyświetlanie ikonę, ale można odwoływać się różne komponenty ikonę jako kształtów indywidualnie.Czcionki ikon
color
,font-size
,line-height
,background-color
lub inne zasady stylizacji czcionek związanych zmienić wyświetlanie ikonęOsobiście polecam stosowanie tła obrazów tylko wtedy, kiedy trzeba wiele kolorów i tych kolorów nie można osiągnąć za pomocą
color
,background-color
i innych reguł CSS związane z kolorami dla czcionek.Główną zaletą korzystania z obrazów SVG jest to, że można nadać różnym komponentom symbolu własną stylizację. Jeśli osadzisz kod SVG XML w dokumencie HTML, jest to bardzo podobne do stylu HTML. Spowodowałoby to jednak powstanie strony internetowej, która używa zarówno tagów HTML, jak i SVG, co może znacznie zmniejszyć czytelność strony internetowej. Dodaje również dodatkowe wzdęcia, jeśli symbol jest powtarzany na wielu stronach i należy wziąć pod uwagę, że stare wersje IE nie obsługują SVG lub mają ograniczone wsparcie.
źródło
„Nie ASCII (ani ↑ / ↓)” wymaga kwalifikacji.
Chociaż znaki te nie są zdefiniowane w American Standard Code for Information Interchange jako glify, ich kody WERE były powszechnie używane do przedstawienia graficznej kodów ASCII 24 i 25 (hex 18 i 19, CANcel i EM: End of Medium). Strona kodowa 437 (zwana przez IBM rozszerzonym ASCII, zawiera kody numeryczne od 128 do 255) definiuje użycie tych glifów jako kodów ASCII, a wszechobecność tych konwencji przeniknęła branżę, co widać po ich wdrożeniu jako standardów przez wiodące firmy, takie jak HP, szczególnie dla drukarek i IBM, szczególnie dla mikrokomputerów, począwszy od oryginalnego komputera.
Podobnie jak użycie kodów ASCII dla CAN i EM było wówczas stosunkowo przestarzałe, co uzasadnia ich użycie jako glifów, tak upływ czasu sprawił, że użycie kodów jako glifów stało się przestarzałe w związku z obecnym stosowaniem konwencji UNICODE.
Należy podkreślić, że rozszerzenia ASCII wykonane przez IBM w rozszerzonym ASCII obejmowały nie tylko większy zestaw liczb dla kodów numerycznych od 128 do 255, ale także rozszerzyły zastosowanie niektórych numerycznych kodów sterujących, w zakresie ASCII od 0 do 32, od tylko protokoły sterowania transmisją mediów zawierające glify. Często niepoprawnie zakłada się, że pierwsze 0 do 128 nie były „rozszerzone” i że IBM używał glifów konwencjonalnego ASCII dla tego zakresu. Ten błąd występuje również w jednym z poprzednich odniesień. Ten błąd stał się tak powszechny, że kolokwialnie na nowo zdefiniował ASCII podprogowo.
źródło
Wiem, że jestem spóźniony na imprezę, ale możesz to zrobić również za pomocą zwykłego CSS:
HTML:
(Może to być dowolny element HTML, jeśli używasz elementu wbudowanego, takiego jak
<span>
na przykład, upewnij się, że jest to element blokowy / element wbudowany blokowy za pomocądisplay:block;
lubdisplay:inline-block
) :<div class="up"></div>
i
<div class="down"></div>
CSS:
Możesz to również zrobić za pomocą
:before
i:after
pseudo-elementy, które w rzeczywistości jest lepszy sposób, ponieważ można uniknąć tworzenia dodatkowych znaczników. Ale to zależy od tego, jak chcesz to osiągnąć.-
Oto demo w CodePen z wieloma możliwościami strzałek.
źródło
Wiele osób sugeruje użycie trójkątów, ale czasami potrzebujesz szewronu.
Mieliśmy przypadek, w którym nasz przycisk pokazuje szewron, i chcieliśmy, aby instrukcja użytkownika odnosiła się do przycisku w sposób, który zostanie rozpoznany przez użytkownika nietechnicznego. Potrzebowaliśmy więc znaku szewronu.
W końcu użyliśmy ﹀. Jest znany jako FORMULARZ PREZENTACJI DLA PIONOWEGO WSPORNIKA KĄTA PRAWEGO, a jego kod to U + FE40.
źródło
Zwykle najlepiej jest zobaczyć postać w jej kontekście.
Oto pełna lista znaków Unicode oraz sposób ich wyświetlania w przeglądarce. Ta lista ewoluuje, wersje przeglądarek po innych.
Ta lista jest uzyskiwana przez iterację dziesiętną tabeli Unicode encji HTML, może to zająć kilka sekund, ale w wielu przypadkach jest bardzo przydatne.
Po najechaniu kursorem na dany znak otrzymasz dec i hex oraz skróty do wygenerowania go za pomocą klawiatury.
Ten sam fragment jak bookmarklet:
Aby wygenerować tę listę z php :
Aby wygenerować tę listę w konsoli, używając php :
Oto wyciąg ze zwykłego tekstu, ze strzałkami, niektóre pochodzą z Unicode 10.0 . http://unicode.org/versions/Unicode10.0.0/
🔙🔚🔛🔜🔝🖗🖘🖙🖚🖛🖜🖝🖞🖟🞀🞁🞂🞃🔺🔻🔼🔽𝆒𝆓𐃘⭝⭞⭟⭠⭡⭢⭣⭤⭥⭦⭧⭨⭩⭪⭫⭬⭭⭮⭯⭰⭱⭲⭳⭶⭷ ⭸⭹⭺⭻⭼⭽⭾⭿⮀⮁⮂⮃⮄⮅⮆⮇⮈⮉⮊⮋⮌⮍⮎⮏⮐⮑⮒⮓⮔⮕⮘⮙⮚⮛⮜⮝⮞⮟⮠⮡⮢⮣⮤⮥⮦⮧⮨⮩⮪⮫ ⮬⮭⮮⮯⮰⮱⮲⮳⮴⮵⮶⮷⮸⮹⮽⮾⮿⯀⯁⯂⯅⯆⯇⯈⬶⬷⬸⬹⬺⬻⬼⬽⬾⬀⬁⬂⬃⬄⬅⬆⬇⬈⬉⬊⬋⬌⬍⬎⬏⬐ ⬑⤀⤁⤂⤃⤄⤅⤆⤇⤈⤉⤊⤋⤌⤍⤎⤏⤐⤑⤒⤓⤔⤕⤖⤗⤘⤙⤚⤛⤜⤝⤞⤟⤠⤡⤢⤣⤤⤥⤦⤧⤨⤩⤪⤫⤬⤭⤮⤯⤰ ⤱⤲⤳⤴⤵⤶⤷⤸⤹⤺⤻⤼⤽⤾⤿⥀⥁⥂⥃⥄⥅⥆⥇⥈⥉⥊⥋⥌⥍⥎⥏⥐⥑⥒⥓⥔⥕⥖⥗⥘⥙⥚⥛⥜⥝⥞⥟⥠⥡⥢ ⥣⥤⥥⥦⥧⥨⥩⥪⥫⥬⥭⥮⥯⥰⥱⥲⥳⥴⥵⟨⟩⟪⟫⟬⟭⟮⟯⟰⟱⟲⟳⟴⟵⟶⟷⟸⟹⟺⟻⟼⟽⟾⟿➘➙➚➛➜➝➞ ➟➠➡ ➢➣➤➥➦➧➨➩➪➫➬➭➮➯➰➱➲➳➴➵➶➷➸➹➺➻➼➽➾⊲⊳⊴⊵ ← ↑ → ↓ ↔↕↖↗↘↙↚↛↜↝ ↞↟↠↡↢↣↤↥↦↧↨↩↪↫↬↭↮↯↰↱↲↳↴↵↶↷↸↹↺↻↼↽↾↿⇀⇁⇂⇃⇄⇅⇆⇇⇈⇉⇊⇋⇌⇍⇎⇏ ⇐⇑⇒⇓⇔⇕⇖⇗⇘⇙⇚⇛⇜⇝⇞⇟⇠⇡⇢⇣⇤⇥⇦⇧⇨⇩⇪⇫⇬⇭⇮⇯⇰⇱⇲⇳⇴⇵⇶⇷⇸⇹⇺⇻⇼⇽⇾⇿ᐂᐃᐄᐅᐆᐇᐈᐉᐊᐋᐌᐍᐎᐏᐐᐑᐒᐓᐔᐕᐖᐗᐘᐙᐚᐛᐫᐬᐭᐮᐯᐰᐱᐲᐳᐴᐵᐶᐷᐸᐹᐺᐻᐼᐽᐾᐿᑀᑁᑂᑃᑄᑅᑆᑇᑈ🞀 🞁🞂🞃🠀🠁🠂🠃🠄🠅🠆🠇🠈🠉🠊🠋🠐🠑🠒🠓🠔🠕🠖🠗🠘🠙🠚🠛🠜🠝🠞🠟🠠🠡🠢🠣🠤🠥🠦🠧🠨🠩🠪🠫🠬🠭🠮🠯🠰🠱🠲 🠳🠴🠵🠶🠷🠸🠹🠺🠻🠼🠽🠾🠿🡀🡁🡂🡃🡄🡅🡆🡇🡐🡑🡒🡓🡔🡕🡖🡗🡘🡙🡠🡡🡢🡣🡤🡥🡦🡧🡨🡩🡪🡫🡬🡭🡮🡯🡰🡱🡲 🡳🡴🡵🡶🡷🡸🡹🡺🡻🡼🡽🡾🡿🢀🢁🢂🢃🢄🢅🢆🢇🢐🢑🢒🢓🢔🢕🢖🢗🢘🢙🢚🢛🢜🢝🢞🢟🢠🢡🢢🢣🢤🢥🢦🢧🢨🢩🢪🢫
źródło
Elementy HTML dla pustych trójkątów
◁ =
◁
▷ =
▷
▽ =
▽
△ =
△
źródło
▲ ▼ Są to odpowiednio U + 25B2 (
▲
) i U + 25BC (▼
)źródło
Myślę, że pytający może odnosić się do jednego z nich (patrz załączony obraz) - sam znalazłem to pytanie StackOverflow, szukając tego samego.
Niestety, ten glif nigdzie nie istnieje jako odrębna postać. Wikipedia osiąga to poniżej, używając wbudowanego javascript i img content = "data: image / gif ...", aby uzyskać symbol.
Nawiasem mówiąc, oto base64 dla tego:
Mam nadzieję, że to komuś pomoże!
źródło
Ten wydaje się sugerować, że 030 i 031 są trójkątami w górę iw dół.
(Jak zauważył Bobin, nie wydaje się to standardem ASCII)
źródło
Używam ▼ i ▲, ale mogą one nie działać dla Ciebie. Używam alt 11551 dla pierwszego i 11550 dla drugiego. Zawsze możesz skopiować i wkleić je, jeśli ascii nie jest takie samo dla twojego systemu.
źródło
Zdecydowałem, że najbardziej popularne symbole zalecane tutaj (▼ i ▲) wyglądają zbyt odważnie, więc na stronie codepoints.net, zalecanej przez użytkownika ADJenks, znalazłem te symbole, które wyglądają lepiej na mój gust: 🞀 (U + 1F780) 🞁 (U + 1F781) 🞂 (U + 1F782) 🞃 (U + 1F783)
źródło
Witryną, którą lubię używać do tego, jest codepoints.net
Oto wyszukiwanie słów „grot strzałki” i „trójkąt”: https://codepoints.net/search?q=arrowhead+triangle
Ma kilka dopasowań do „strzały w kształcie trójkąta”, które mają łodygi, ale są to tylko 4 małe strony do przejrzenia i istnieje wiele dobrych dopasowań z ładnymi szczegółami dla każdej postaci.
Istnieje również blok kodu dla „Różnych symboli i strzałek”, a ta strona internetowa wymienia je tutaj: https://codepoints.net/miscellaneous_symbols_and_arrows
źródło
Oto kolejny - ᐞ - Unicode U + 141E / CANADIAN SYLLABICS GLOTTAL STOP
źródło