Jak mogę ustawić wartość domyślną dla HTML <select> Element?
Podczas tworzenia stron internetowych, tworząc formularz, potrzebujemy różnych komponentów, takich jak pola wejściowe, przyciski, przyciski radiowe, listy kontrolne i wiele innych. Menu rozwijane jest jednym z takich elementów, który jest dodawany w formularzu, aby wybrać opcję z listy menu. Można to wykonać na stronie internetowej za pomocą elementu HTML składającego się z kilku opcji określonych w elemencie HTML.
To badanie wykaże metodę ustawienia wartości domyślnej dla elementu HTML.
Jak określić wartość domyślną dla elementu HTML?
Czasami "wybrany„Atrybut musi być dodany do ustawienia opcji domyślnej. W liście rozwijanej opcja z wybranym atrybutem zostanie wyświetlona domyślnie.
Poniższa składnia wyświetla się, jak stworzyć opcję wartość domyślną:
Sprawdź poniższy przykład demonstracji!
Przykład: Ustawianie wartości domyślnej dla elementu HTML
W HTML najpierw dodaj element div o nazwie klasy „treść". Wewnątrz tego elementu:
- Dodaj element nagłówka
.
- Następnie dodaj
element z pewną treścią. element w
element jest wykorzystywany do odważnego tekstu.
- Dołącz HTML "”Element z nazwą i identyfikatorem atrybutów.
- Jak omówiliśmy powyżej, element Select zawiera dostępne opcje w menu rozwijanym. Te opcje są określone za pomocą HTML "" element.
Spójrz więc na fragment kodu poniżej, w którym drugą opcję jest określona za pomocą atrybutu „wybrany„Aby zdefiniować to jako wartość domyślną:
Linuxhint
Wybierz swoje posty:
W tym przypadku, "Autor techniczny”Zostanie wybrane i wyświetlone jako opcja domyślna:
Przejdźmy do sekcji CSS, gdzie użyjemy różnych właściwości stylizacji CSS, aby stylizować elementy HTML.
Styl „treść” div
.treść
Szerokość: 370px;
Wysokość: 280px;
granica: 1px Solid #874C62;
Margines: Auto;
kolor tła: RGB (34, 32, 32);
Wyściółka: 18px;
RADIUS BRAVES: 6px;
„„.treść”Jest wykorzystywany do dostępu do elementu HTML DIV z zawartością klasy. Wyjaśnienie wyżej wymienionych właściwości CSS podano poniżej:
- "szerokość„Właściwość dostosowuje szerokość elementu.
- "wysokość„Właściwość określa wysokość elementu.
- "granica„Własność określa granicę wokół elementu. Wartość określa szerokość obramowania, styl graniczny i kolor graniczny.
- "margines„Własność określa ilość miejsca wokół elementu.
- "kolor tła”Określa kolor tła elementu.
- "wyściółka”Jest wykorzystywany do zwiększenia przestrzeni wokół treści elementu.
- "Radiusz graniczny”To właściwość, która sprawia, że narożniki elementu okrągłe.
Style „P”
.Treść P
Rozmiar czcionki: 20px;
kolor: #fff;
Element treści DIV jest stylizowany z następującymi właściwościami:
- "rozmiar czcionki”Ustawia rozmiar czcionki elementu.
- "kolor„Właściwość dostosowuje kolor czcionki elementu.
Styl „Wybierz” element
wybierać
Wyściółka: 5px;
RADIUS BERDER: 5px;
Zarys: Brak;
Rozmiar czcionki: 18px;
Element Select jest stosowany z następującymi właściwościami:
- "zarys„Właściwość określa granicę lub zarys wokół elementu, głównie po jego wyborze.
- „„wyściółka”,„Radiusz graniczny", I "rozmiar czcionki”Właściwości wykonują funkcje, jak podano powyżej.
Element stylu „H1”
.Treść H1
Text-Align: Center;
Rozmiar czcionki: 45px;
Kolor: #E485B9;
Element jest ozdobiony następującymi właściwościami: - "tekst-align„Właściwość dostosowuje wyrównanie tekstu elementu.
- "rozmiar czcionki" I "kolor”Właściwości stylizowały element w taki sposób, jak wspomniano powyżej.
Poniższy GIF wyświetla ostateczny wynik kodu:
W ten sposób możesz ustawić wartość domyślną dla elementu HTML.
Wniosek
Element HTML zawiera kilka wybranych menu. Te menu są określone w elemencie HTML. Aby ustawić domyślną wartość dla elementu HTML, należy określić atrybut „wybrany”Dla tej opcji. W tym badaniu opisano element HTML i metodę ustawienia jego wartości domyślnej za pomocą praktycznego przykładu.