Typ stylu listy CSS

Typ stylu listy CSS
Arkusz stylów kaskadowych zawiera kawałek kodu odpowiedzialny za dodanie efektów i właściwości do treści opracowanej przez HTML. Zarówno HTML, jak i CSS są używane do tworzenia statycznej strony internetowej lub dynamicznej strony internetowej. CSS zawiera kilka efektów, jeden z nich to właściwość stylowa, która jest stosowana do listy HTML. Ta właściwość ma na celu ulepszenie elementów listy, czyli najprawdopodobniej tekst, dodając efekty na pociskach. Dzisiaj nasza dyskusja dotyczy typu stylu listy. W artykule wspominamy o kilku przykładach, aby stylizować pociski listy wyjątkowo.

Kod HTML zawiera dwie podstawowe części: i . Część główna zawiera znacznik tytułu i tag, jeśli używamy wewnętrznego CSS. Tag zawiera tagi wszystkich treści, które chcemy utworzyć na stronie internetowej. Znacznik listy jest również zapisany wewnątrz znacznika ciała.

Podobnie kod CSS jest klasyfikowany jako CSS inline, wewnętrzny i zewnętrzny. Efektem zapisanym znacznikiem wewnątrz znacznika zawartości jest wbudowany CSS. Ten, który jest zapisany wewnątrz sekcji HTML, to wewnętrzne CSS. A trzeci, zewnętrzny CSS, jest zadeklarowany w pliku innego edytora tekstu za pomocą „.rozszerzenie CSS ”.

Co to jest lista HTML?

Hypertext Markup Język tworzy treść, aby stworzyć stronę internetową, w tym tekst, obrazy, tabele, kształty, akapity itp. Tekst jest elementem konstrukcyjnym dowolnej strony internetowej. Można to napisać na kilka sposobów, a jednym podejściem jest „Lista” HTML. Lista to pionowa demonstracja tekstu wraz z kulami lub bez. Lista HTML pojawia się po prostu w taki sam sposób, jak tworzymy listę ręczną. Lista jest podzielona na kolejne kategorie. Gdy tekst jest reprezentowany liczbami, jest to wykonywane przez uporządkowaną listę

    . Jeśli reprezentacja jest przez dowolny symbol lub kształt, jest to lista nieopisana
      . Składnia używana do utworzenia listy jest wymieniona w następujący sposób:


      • przedmiot 1

      • Pozycja 2

      Składnia listy nie uporządkowanej jest podana w poprzednim przykładzie. Pierwsze tagi otwarcia i zamykania listy są zadeklarowane. Te zewnętrzne znaczniki decydują, czy lista jest zamówiona czy nie zamówiona. Wewnątrz obu tagów,

    • Tag służy do dodania nazw elementów, którym chcemy być częścią listy.

      Własność w stylu listy

      Właściwość CSS List Style to efekty stosowane do pocisków listy. Istnieje kilka rodzajów właściwości stylu list. Niektóre z nich są tutaj wyjaśnione. Podstawowa składnia jest napisana jako:

      Wdrożyćmy i wyjaśnijmy działanie tej nieruchomości.

      Lista typu stylu dla nieuporządkowanej listy

      Najpierw stosujemy pewne efekty do pocisków nieuporządkowanej listy. Te kule są symbolami i kształtami. Na przykład koła, kwadraty, dyski itp.

      Wartość właściwości: dysk

      Tworzymy prostą stronę internetową, na której nagłówek jest podawany w części ciała. Używamy znacznika akapitowego do napisania tekstu. Następnie tworzona jest lista nieopisana, jak wcześniej opisaliśmy. Ta sama składnia następuje. W środku

        tag, deklarujemy nazwę klasy należącej do wewnętrznego CSS. Wszystkie efekty wymienione w klasie są stosowane do tej listy tutaj:

          Wewnątrz znacznika, trzy elementy listy są zadeklarowane. Zamknij listę i zewnętrzny znacznik. To wszystko z sekcji ciała kodu HTML.

          Teraz prowadzimy do sekcji głównej. W głowę podajemy tytuł strony. Następnie zadeklarowany jest wewnętrzny tag stylu CSS. Wewnątrz, „sub”, nazwa używana wewnątrz nieuznosego znacznika listy, jest zadeklarowana. Wszystkie efekty są stosowane w tej klasie.

          Identyfikatory i klasy są tworzone w celu zbiorowego wykorzystania efektów, które chcesz zastosować. Następnie użyj tych nazw wewnątrz znaczników, w których chcemy zastosować te efekty.

          .pod
          Typ w stylu listy: Disc;

          Używany tutaj styl listy to dysk. Jeśli nie używamy tej właściwości w tworzeniu listy, tworzone domyślne pociski są w kształcie dysku.

          Dalsze efekty są na nagłówku. Kolor czcionki jest dodawany do nagłówka. Oprócz ciała stosuje się kolor tła i kolor czcionki.

          Zapisz kod w edytorze tekstu z rozszerzeniem HTML, aby utworzyć stronę internetową, która ma być wykonana w przeglądarce. Korzystając z tego rozszerzenia, zobaczysz, że symbol zapisanego pliku edytora tekstu jest zmieniany na ikonę przeglądarki. Jest to wskazanie, że jest to strona internetowa.

          Wykonasz, że utworzona strona internetowa zawiera listę nazw przedmiotów, a elementy te są zadeklarowane przez pociski dysku.

          Wartość właściwości: okrąg

          Po użyciu domyślnej wartości pocisku dysku, używamy innego kształtu do stylizowania listy nieopisanej. Tym razem właściwość Style zawiera klasę z typem stylu List Circle. Podczas gdy reszta kodu, niezależnie od tego, czy część głowy, czy sekcja ciała, jest taka sama. Dokonaj tylko zmian w stylu, aby zobaczyć działające efekty.

          List typu stylu: Circle;
          Kod CSS: Wyjście:

          Zamknij znacznik stylu i wykonaj kod w przeglądarce. Zobaczysz, że wypełnione pociski dysku są zastępowane przez pociski w kształcie koła.

          Lista typu stylu dla uporządkowanej listy

          Teraz używamy wartości numerycznych i alfabetycznych, aby zastosować wpływ na pociski uporządkowanej listy.

          Wartość właściwości: dziesiętne

          Jeśli chodzi o utworzenie uporządkowanej listy, używamy dowolnej wartości liczbowej. Tym, który jest zwykle używany w manualnym liczeniu lub numeracji, jest notacja dziesiętna. Najpierw wybierzemy liczbę dziesiętną. Cały kod HTML jest taki sam, a kod CSS jest rozrywany tylko za pomocą nazwy pocisku, określanego jako „dziesiętne”. Efekt typu stylu listy wymieniony w klasie CSS to dziesiętne.

          Typ w stylu listy: dziesiętny;
          Kod CSS Wyjście:

          Po wykonaniu zobaczysz, że pociski są zmieniane z okręgu na liczby dziesiętne.

          Wartość właściwości: niższy greek
          Właściwość w stylu listy jest wymieniona w Lower Greek w celu zastosowania tego efektu i zmodyfikowania właściwości w stylu listy listy.

          Kod CSS Wyjście:

          Wartość właściwości: Brak

          Możemy również ukryć pociski listy za pomocą słów kluczowych „Brak” w właściwości typu stylu listy.

          Kod CSS Wyjście

          Wartość nieruchomości: Gruzin

          Ostatnia, ale nie najmniej, stosowana wartość to wartość „gruzińska”, która jest dodawana do pocisków listy.

          Kod CSS Wyjście

          Wniosek

          Właściwość CSS List Style to efekt stosowany na pociskach listy, niezależnie od tego, czy lista jest zamówiona, czy nie uporządkowana. Zaczęliśmy od prostego wprowadzenia języków HTML, jak i CSS, w tym ich deklaracji tagów. Następnie opracowaliśmy strukturę list HTML wraz z ich typami. Właściwość typu stylu listy jest opracowana i wdrożyliśmy kilka stylów, aby zobaczyć, jak działa ta właściwość. Wykorzystaliśmy kilka przykładów zarówno dla uporządkowanych, jak i nieopisanych list osobno.