2011-12-29 24 views
5

Sprawdzam/używam Twitter Bootstrap od dłuższego czasu. Podoba mi się to, co zrobili, ale co więcej, lubię rozumieć to, co robię.Jak utworzyć strzałkę rozwijaną z Bootstrapa na Twitterze?

Po sprawdzeniu strzałki rozwijanej z inspektorem przeglądarki Chrome wygląda na to, że jest to encja html z ↓. Próbowałem to powtórzyć, ale bez powodzenia. Dostaję brzydką strzałę, a nie prosty trójkąt.

Jakie są minimalne właściwości CSS do użycia w celu ich odtworzenia?

PS: Łącze do jsFiddle próbuje je odtworzyć.

+2

Czy możesz wskazać mi, którą strzałkę widzisz. Link do strony byłby świetny. – Sum

+1

Tak, na pewno, powinienem był to zrobić na pierwszym miejscu: http://twitter.github.com/bootstrap/#navigation –

Odpowiedz

6

Oto working example.

Nie potrzebujesz dodatkowego ↓ w kodzie HTML, a border-color było white, czyniąc go niewidocznym na białym tle dla bardzo ludzkich oczu.

+0

To było tam od początku ...: P Wielkie dzięki! –

+0

Bez problemu. Cieszę się, że pomogłem! –

0

Najpierw unikaj domyślnych stylów przeglądarki. Następnie użyj własnego. Na przykład:

select{ 
    -webkit-appearance: none; 
    -moz-appearance: none; 
    appearance: none; 

    height: 60px; 
    border: 1px solid #ccc; 
    padding: 0 0 0 20px; 
    font-size: 18px; 
    font-weight: 300; 
    border-radius: 0; 
    color: #999; 
    letter-spacing: 1px; 
    background: url("../img/[email protected]") calc(100% - 10px) 24px #fff no-repeat; 
    cursor: pointer; 
} 
Powiązane problemy