Znak CSS Plus
Przykład 01:
Zacznijmy od pierwszego przykładu użycia znaku plus w kodzie HTML, aby korzystać z niego na wiele sposobów. Przyglądamy się znaczniku ciała kodu HTML. W ramach strony strony HTML mamy nagłówek rozmiaru 1, który stwierdza, że używamy znaku plus za pośrednictwem stylizacji CSS dla najlepszych historii, które zostaną wydane. Używamy kolejnego nagłówka o rozmiar 2, który jest drugim co do wielkości rozmiarem nagłówków HTML, a następnie znacznika Div. Ten znacznik „div” tworzy nową sekcję zawierającą pewne informacje dotyczące daty wydania i miejsca, w którym jest wydany.
Po tym znaczniku mamy inny znacznik „div”, który jest używany do tworzenia nowej sekcji na stronie HTML. Sekcja ciała tego HTML jest ukończona tutaj. Rzućmy okiem na „styl” strony HTML, aby spojrzeć na styl różnych elementów. W ramach tego znacznika używamy znaku plus „+” wśród nagłówków i znacznika „div”, aby zastosować styl na elemencie „div” przylegającym do nagłówka 2. Rozmiar czcionki to 22 pikseli, masa czcionki jest lżejsza, wyświetlacz jest wbudowany, a kolor tła dla sekcji „Div” jest fioletowy, a kolor tekstu jest lekki cyjan. Następnie używamy tytułu H1 nagłówka, aby stylizować go w prawie czarnym kolorze tekstu. Stylizacja jest tutaj zakończona.
Wyjście tego kodu jest wyświetlane na następującym obrazie. Pierwszy nagłówek w rozmiarze 1 jest kolorowy ciemnoniebieski, podczas gdy drugi nagłówek drugiego co do wielkości jest wyświetlany w kolorze odrzutowym. Ponieważ pierwszy znacznik DIV sąsiaduje z nagłówkiem 2 strony HTML, jest on stylizowany zgodnie z właściwościami używanymi dla połączonych elementów „Div” i „H2”. Z drugiej strony, nagłówek 1 jest stylizowany zgodnie z użyciem H1 w stylu.
Przykład 02:
Zacznijmy od kolejnego przykładu użycia znaku plus do stylu. Rozpoczynamy ten przykład od użycia głównego znacznika Doctype HTML, a następnie pojedynczego otwarcia znacznika głowy. Kontynuuje otwarcie znacznika tytułowego zawierającego w nim tytuł „CSS Plus Sign” i zamknięcie tytułowego znacznika.
Rzućmy okiem na obszar ciała kodu HTML za pomocą znacznika elementu ciała. Używamy różnych nagłówków i akapitów za pośrednictwem ich konkretnych tagów, tj.mi. „H1, H2 i P”. Najpierw używamy nagłówka H1 największego rozmiaru. Następnie używamy nagłówka 2 drugiego co do wielkości wraz z sąsiednim akapitem. Po nagłówek tworzymy nowy tag DIV, aby utworzyć nową sekcję na stronie HTML. Na koniec ponownie używamy nagłówka 2, a następnie element akapitowy w sekcji Div.
Korzystając ze znaku Plus między nagłówkiem 2 a akapitem, stylizujemy akapit przylegający do nagłówka 2. Mamy więcej niż jeden nagłówek tego samego rozmiaru. Dlatego wymaga nagłówka 2, który jest pierwszy od początku znacznika ciała. Używamy zielonego koloru w akapicie sąsiadującym z pierwszym nagłówkiem 2 o rozmiarze czcionki 28 pikseli, khaki w kolorze tła i właściwości tekstowej, aby wyświetlić tekst wielki.
Następnie używamy tagu akapitowego, aby stylizować pozostałe akapity naszej strony HTML, zabarwiając ją z herbatą różową z odważną wagą czcionki i rodziny fantasy czcionek. Chodzi o użycie znaku plus do stylizacji. Uruchommy ten kod teraz.
Otrzymujemy wyjście z nagłówkami rozmiarów 1 i 2 bez żadnych stylizacji. Pierwszy akapit jest wyświetlany we wszystkich wielkich słowach z tłem Khaki i tekstem zielonym. Podczas gdy ostatni akapit jest wyświetlany osobno w fioletowym tekście kolorowym. Zastosowanie znaku plus do stylizacji akapitu nie wpływa na styl drugiego akapitu.
Przykład 03:
Ciało zaczyna się od elementu nagłówka 1, a następnie elementu DIV, aby utworzyć nową sekcję. Ta sekcja zawiera w sumie cztery elementy akapitu do utworzenia różnych akapitów i jednej sekcji Div, która również wykorzystuje znacznik akapitu do utworzenia pojedynczego akapitu w tej sekcji.
Po zakończeniu wszystkich elementów wewnętrznych tego rozdziału zamykamy zewnętrzną sekcję Div wraz z zamknięciem sekcji ciała. W obrębie stylu używamy akapitu „P”, aby zastosować masę czcionki jako odważną i rozmiar czcionki 25 pikseli do wszystkich akapitów w ciele. Teraz używamy znaku plus w dwóch znacznikach akapitowych, aby zastosować określoną styl w sąsiednim akapicie pierwszego akapitu w sekcji ciała. Dla drugiego akapitu ustawiono różne właściwości związane z granicą i tekstem.mi. Podwójna granica 5px.
Teraz ponownie używamy tagów akapitowych ze znakiem plus, aby stylizować 3. i 4 sąsiednie akapity obszaru ciała. Ustawiane są różne właściwości stylu czcionek wraz z właściwością koloru granicznego i zarysu granicznego, i.mi. Przez sąsiednie akapity są określone na granicy 5 pikseli kropkowanych i szkarłatnych. Teraz kod jest zakończony i zmierzamy, aby go wykonać.
Wyjście pokazuje, że drugi akapit jest stylizowany zupełnie inaczej niż reszta akapitów, podczas gdy trzecie i czwarte akapity są stylizowane podobnie. Pierwszy i piąty akapit wygląda podobnie w stylizacji.
Wniosek
W tym artykule pokazano kilka prostych przykładów ilustrujących użycie znaku „+” plus w skryptowaniu HTML. Dowiedzieliśmy się, w jaki sposób znak „+” plus może stylizować niektóre elementy wymienione po znaku „+” plus w stylu CSS bez zmiany stylizacji pierwszego określonego elementu HTML. W tym celu wykorzystaliśmy w sumie 3 przykłady do stylizowania akapitów i sekcji DIV. Korzystając z tego elementu atrybutu, możesz wprowadzić zmiany na dowolnej stronie HTML bez obawy przed utratą formatowania strony HTML.