Użytkownicy mogą stosować wiele właściwości CSS, aby strony internetowe są atrakcyjnewysokość”,„szerokość”,„tekst-align”,„styl graniczny”,„Radiusz graniczny", I "wyściółka". Mówiąc dokładniej, „granica„Własność dodaje granicę wokół elementu. Ponadto użytkownik może chcieć dodać przezroczystą granicę wokół elementu, aby sprawy za obiekty są bardziej widoczne. „„granica”Atrybut z„RGBA„Wartość jest następnie wykorzystywana do ustawienia krycia granicy.

Ten post wyjaśni metodę tworzenia przezroczystej granicy za pomocą właściwości CSS.

Jak zrobić przejrzystą granicę z CSS?

Aby zrobić przejrzystą granicę z CSS, wypróbuj daną procedurę.

Krok 1: Utwórz kontener Div

Najpierw stwórz „„Pojemnik w ciele HTML. Dodaj atrybut klasy w elemencie.

Krok 2: Dodaj nagłówek

Następnie dodaj nagłówek z pomocą „

”Tag i użyj„wyrównywać”Atrybut określający nagłówek na środku div. Następnie dodaj tekst między dodanymi znacznikami nagłówków:

Linuxhint Tutorial Witryna Ltd UK

Wyjście

Krok 3: Ustaw kolor tła

ciało
kolor tła: RGB (8, 8, 14);

Uzyskaj dostęp do ciała według nazwy znacznika i określ kolor tła, wykorzystując „kolor tła" nieruchomość.

Krok 4: Styl kierujący CSS

H1
Kolor: RGB (23, 83, 5);

Teraz zastosuj „kolor„Właściwość do stylizowania tekstu nagłówka za pomocą nazwy znacznika”H1".

Krok 5: Zrób solidną granicę

Następnie dostęp do „.Zewnętrzny kontakt”Zajęć i określ wymienione właściwości CSS:

.zewnętrzny content
granica: 10px Solid RGB (25, 140, 194);
szerokość: 200px;
Wysokość: 200px;
Margines: Auto;
Text-Align: Center;
RADIUS BERDER: 7px;
Wyściółka: 4px;

Tutaj:

• „„granica„Własność służy do tworzenia granicy wokół elementu.
• „„szerokość”Określa szerokość elementu.
• „„wysokość„Nieruchomość przydziela wysokość pojemnika.
• „„margines”Określa kosmiczną stronę zdefiniowanej granicy.
• "tekst-align„Właściwość jest wykorzystywana do ustawienia tekstu na środku.
• "Radiusz graniczny”Własność okrążenia narożnika granicznego zgodnie z wartością.
• "wyściółka”Określa przestrzeń wokół zawartości elementu.

Można zauważyć, że wokół elementu ustawiono solidną granicę:

Krok 6: Spraw, by granica przejrzysty

Border: 10px Solid RGBA (114, 200, 240, 0.3);

Aby granica jest przezroczysty, użyj „granica”Właściwość i przypisz wartość za pomocą„RGBA" narzędzie do wybierania kolorów. Tutaj pierwsze trzy wartości określają kolor RGB, a czwarta wartość ustawia krycie granicy. Na przykład nieprzezroczystość jest przypisywana jako „0.3„Aby granica jest przezroczysty:

Wyjście

Ten blog wykazał instrukcje tworzenia przejrzystej granicy z CSS.

Wniosek

Aby zrobić przejrzystą granicę z CSS, najpierw uzyskać dostęp do DIV za pomocą określonego „klasa". Następnie użyj „granica”Właściwość i ustaw kolor i krycie granicy za pomocą„RGBA" narzędzie do wybierania kolorów. Gdzie "RGB”Jest dla kolorów czerwonych, zielonych i niebieskich oraz„A”Służy do ustawienia wartości krycia, aby granica jest przezroczysty. W tym poście wyjaśniono procedurę sprawienia, aby granica przezroczysty z CSS.