Jak stworzyć wyściółkę w CSS?

Padding CSS pozwala koderowi HTML ustawić domyślną wyściółkę lub martwą przestrzeń poza elementem HTML. Zaletą tego jest to, że zapisuje kodera przed powtarzaniem tego kodu wyściółki dla każdego wystąpienia tego elementu i łatwiej powoduje spójność na stronie. Elementem HTML do wyściółki może być dowolna liczba rzeczy, takich jak akapit, tabela lub nagłówek.

Aby stworzyć wyściółkę w CSS, najpierw musisz zidentyfikować element HTML, który chcesz wpadać. Ten element, który chcesz padać, jest znany jako selektor. Następnie będziesz chciał określić odpowiednie wartości wyściółki. Istnieje pięć różnych rodzajów właściwości wyściółki w CSS - jedna dla wszystkich czterech stron elementu jednocześnie, a cztery inne dla każdej poszczególnych stron elementu (np. Lewa strona, prawa strona, górna lub dolna strona). Właściwość, która pozwala programistowi określić wartości dla wszystkich czterech stron elementu HTML jednocześnie, nazywa się właściwością stenograficzną .

Język kodowania używany do określenia jednej deklaracji wyściółki CSS jest po prostu słowo „wyściółka”. Zgodnie z tą etykietą są odpowiednie „wartości” wyściółki lub informacje na temat pożądanej przestrzeni, zwykle reprezentowanej przez piksele lub procent. Wyściółka i wartości są zapisane wewnątrz kręconych aparatów ortodontycznych lub kręconych nawiasów (tj. „{” I „}”). Poprzedzając to wszystko element HTML do wyściółki (np. „P” dla akapitu lub „H2” dla nagłówków poziomu 2).

Jeśli chodzi o sposób reprezentowania wartości, wartości można reprezentować w pikselach (np. 1px lub 5px), punktach (np. 1pt lub 5pt) lub calach (np. 1 cala lub 5 cali) lub centymetrach (np. 1 cm lub 5 cm). Wartości można również zadeklarować jako procent stylowania elementu HTML. Jeśli wartość wynosi 50%, na przykład wyściółka będzie równa połowę wielkości elementu.

Poniższe przykłady to kod HTML do wyściółki HTML Elelement poprzez wartości odzwierciedlone odpowiednio w procentach i długości. Jeśli przypisana jest tylko jedna wartość, wówczas przeglądarki internetowe przypisają tę wyściółkę do wszystkich czterech stron elementu HTML.

Wyściółka: 10%;
Wyściółka: 100px;

Dodanie większej liczby wartości do rodzaju wyściółki powyżej spowoduje, że przeglądarki internetowe interpretują je w określony sposób. Jeśli przypisane zostaną dwie wartości, pierwsze będzie odpowiadały górnemu i dolnemu, podczas gdy drugi odpowiada lewej i prawej. Trzy wartości spowodują, że pierwsze odniesie się do góry, drugie po lewej i prawej stronie, a trzeci do dolnej części elementu HTML. Przypisanie maksimum czterech wartości powoduje, że pierwsza, druga, trzecia i czwarta wartości odpowiadają górnym, prawym, dolnym i lewym elementowi HTML w tej kolejności. Gdy podano więcej niż jedną wartość, należy je oddzielić przestrzeniami i zakończyć półkolonem, na przykład:

Padding: 10px 20px 10px 20px;

Władze w CSS można wykonać jedną stronę wrównież czas. Pod tym względem dostępne są cztery kolejne nieruchomości wyściółki. Są to wyściółki, prawe wyściółki, wyściółki i wyściółki lewicowe. Aby utworzyć wyściółkę w CSS w ten bardziej precyzyjny sposób, musisz oznaczyć właściwości o tej samej składni jak deklaracje skrótów jak powyżej. Każda z tych właściwości wyściółki ma tylko jedną wartość pod względem długości lub procentu. Na przykład:

TOP: 10px;
PRAWADY: 20px;
Wyściółka: 10px;
Padding-Left: 20px;

Poniższy kod tworzy stronę internetową, deklaruje właściwości wyściółki między znacznikami stylów, a następnie używa ich w elemencie akapitowym określonym przez znacznik P. Tekst między/ * a */są notatkami, aby wyjaśnić rodzaj zastosowanej wyściółki i nie byłby zawarty w kodzie wyściółki CSS.