W HTML atrybut nazwy jest używany do określenia nazwy elementu w HTML, takim jak wiek, data i wiele innych. Jest również wykorzystywany w formie odniesienia, gdy dane w formularzu są przesłane. Ponadto użytkownik może stylizować element ”nazwa”Uzyskując do niego za pomocą selektora, a następnie zastosuj właściwości CSS, w tym„wysokość”,„kolor”,„kolor tła”,„rozmiar czcionki”I wiele innych zgodnie z twoim wyborem.

Ten post pokaże o zastosowaniu stylu CSS do nazwy elementu.

Jak mogę zastosować styl CSS do nazwy elementu?

Tak, użytkownik może stylizować nazwę elementu za pomocą różnych właściwości CSS, stosując je. Aby to zrobić, wypróbuj podaną procedurę krok po kroku.

Krok 1: Utwórz kontener Div

Początkowo skorzystaj z „„Tag do utworzenia kontenera Div. Następnie dodaj atrybut klasy i przypisz nazwę do klasy zgodnie z preferencjami. W tym scenariuszu „Div-Main”Jest ustawiony jako nazwa klasy.

Krok 2: Dodaj nagłówek

Następnie wstaw nagłówek za pomocą „

”I osadzaj tekst między znacznikiem otwierania i zamykania.

Krok 3: Utwórz formularz

Aby utworzyć formularz, postępuj zgodnie z tą procedurą:

• Najpierw dodaj „”Element używany do tworzenia formularza.
• Następnie skorzystaj z „„Element do osadzenia etykiety, a następnie„”Element służy do alokacji pól formularzy.
• Typ wejścia jest ustawiany jako „tekst”, Który określa pole tekstowe w formie.
• „„symbol zastępczy„Przydziela krótką wskazówkę, która określa wartość wyświetlania w polu wejściowym.
• "nazwa”Atrybut określa oczekiwane odniesienie po przesłaniu formularza.
• „„min”Określa minimalną wartość dla„" element.
• Typ wejściowy „składać”Jest wykorzystywany do dodania przycisku do formularza:

Styl CSS do nazwy elementu

Twoje imię




Twoja płeć




Twój wiek

Można zauważyć, że formularz został pomyślnie stworzony:

Krok 4: Klasa dostępu

Teraz uzyskaj dostęp do klasy, korzystając z selektora klasy z nazwą klasy. Na przykład, ".Div-Main”Służy do dostępu do klasy głównej.

Krok 5: Zastosuj właściwości CSS

Po uzyskaniu dostępu do klasy zastosuj właściwości CSS do stylizacji:

.Div-Main
Styl graniczny: przerywany;
Margines: 20px 70px;
Wyściółka: 20px;
kolor tła: RGB (177, 245, 222);

Tutaj:

• "styl graniczny„Własność jest wykorzystywana do dodawania stylu do granicy elementu.
• "margines„Definiuje przestrzeń poza zdefiniowaną granicą wokół elementu, gdzie pierwsza wartość to„20px”I dodaje miejsce na górze i dolnej części, a drugą wartość”70px”, Ustawia przestrzeń po lewej i prawej stronie.
• "wyściółka”Definiuje przestrzeń wewnątrz granicy.
• "kolor tła”Jest wykorzystywany do określenia koloru z tyłu elementu.

Wyjście

Krok 6: Element dostępu „Nazwa”

Teraz uzyskaj dostęp do „" element "nazwa". Na przykład uzyskamy dostęp do pola wejściowego o nazwie „wiek".

Krok 7: Zastosuj styl CSS na element „Nazwa”

Następnie zastosuj style CSS na element „nazwa”Korzystając z wymienionych właściwości:

wejście [name = "wiek"]
Wysokość: 40px;
Kolor: RGB (243, 242, 242);
kolor tła: RGB (241, 34, 7);
pogrubiona czcionka;
Rozmiar czcionki: duży;

W powyższym kodzie:

• "wysokość„Właściwość przydziela wysokość do wybranego elementu.
• "kolor”Służy do określenia koloru tekstu elementu.
• "kolor tła”Służy do ustawiania koloru tła elementu.
• "czcionka”Jest ustawiony jako„pogrubiony„Aby było to widoczne.
• "rozmiar czcionki”Określa rozmiar czcionki. Po modyfikowaniu rozmiaru czcionki zmienia również rozmiary czcionki.

W rezultacie element „wiek„Będzie stylizowany w następujący sposób:

Nauczyliśmy cię o zastosowaniu stylu CSS do nazwy elementu.

Wniosek

Tak, użytkownik może stylizować nazwę elementu za pomocą różnych właściwości CSS, stosując je. Aby to zrobić, najpierw utwórz formularz i dodaj wiele pól. Następnie uzyskaj dostęp do „nazwa„Element z„”Tag, wykorzystując„wejście [name = „”]”Składnia. Następnie zastosuj wymagane właściwości CSS. W tym poście wyjaśniono metodę stylizacji nazwy elementu poprzez zastosowanie właściwości CSS.