Własność granicowa w CSS

Własność granicowa w CSS
Budowanie chwytliwej strony internetowej nie jest łatwym zadaniem, programista musi wypróbować wiele rzeczy, aby stworzyć atrakcyjną stronę internetową, taką jak różne tła, style, granice itp.

Obramowanie CSS może być używane wokół treści, aby poprawić wygląd treści. Właściwości graniczne pozwalają nam określić obszar graniczny elementu (. Obramowanie można określić z wieloma stylami, takimi jak linia ciągła, kretyny itp.

Ten zapis zapewni kompleksowy przegląd nieruchomości granicznej. Początkowo wyjaśnia, jak predefiniowane wartości działają z właściwością szerokości granicznej. A następnie pokazuje działanie właściwości szerokości granicznej przy użyciu niektórych określonych wartości.

Własność granicy

Właściwość szerokości granicznej określa szerokość granicy elementu. Określa szerokość granicy we wszystkich czterech kierunkach i.mi. górny, dolny, prawy i lewy. Każda wartość przypisana do właściwości granicznej będzie określona po wszystkich stronach.

Składnia
Składnia właściwości granicznej jest opisana w fragmencie poniżej podanego:

szerokość graniczna: rozmiar;

Wielkość szerokości można określić przy użyciu niektórych predefiniowanych wartości, takich jak grube, cienkie, średnie lub w postaci pikseli, punktów, centymetrów itp.

Rozważmy kilka przykładów za głębokie zrozumienie własności granicznej w CSS.

Jak przypisać szerokość graniczną za pomocą predefiniowanych wartości

W CSS możemy określić rozmiar granicy za pomocą predefiniowanych wartości, takich jak gruby, cienki, średni.

Przykład
Poniższy kawałek kodu ustawia rozmiar granicy

, I

element wykorzystujący predefiniowane wartości:

CSS

H1
Styl graniczny: solidny;
szerokość graniczna: gruba;

P
Styl graniczny: solidny;
szerokość graniczna: medium;

Html

Szerokość granicy za pomocą predefiniowanych wartości


Pierwszy paragraf


Akapit drugi

Wytworzy następujące dane wyjściowe:

Jak dodać szerokość graniczną przy użyciu określonych wartości

W CSS możemy przypisać określony rozmiar, aby ustawić szerokość granicy (i.mi. PX, CM itp.).

Przykład
Następujące kody ustawiają szerokość granicy

element w PX i szerokości granicy

W CM:

CSS

H1
Styl graniczny: solidny;
szerokość graniczna: 0.1 cm;

P
Styl graniczny: solidny;
szerokość graniczna: 1px;

Html

Szerokość granicy za pomocą predefiniowanych wartości


Pierwszy paragraf


Akapit drugi

Otrzymamy następujące dane wyjściowe dla powyższego kodu:

Jak przypisać określone szerokości boczne

W CSS specyficzne szerokości boczne można przypisać do właściwości szerokości granicznej. Domyślnie właściwość szerokości granicy ustawia szerokość równej granicy na wszystkie cztery strony. Możemy jednak określić szerokość każdej strony w górnej, prawej, dolnej i lewej kolejności.

Przykład
Ten przykład przypisuje cztery wartości do właściwości szerokości tła pierwszego dla górnej granicy, drugi dla prawej granicy, trzeci dla dna i ostatni dla lewej granicy:

CSS

H1
Styl graniczny: solidny;
szerokość graniczna: 0.3 cm 0.2 cm 0.1 0.2;

P
Styl graniczny: solidny;
szerokość graniczna: 3px 2px 1px 1px;

Hmtl

Szerokość granicy za pomocą predefiniowanych wartości


Pierwszy paragraf


Akapit drugi

Powyższy kod wytworzy następujące dane wyjściowe:

Przykład 2
Ten przykład przypisuje dwie wartości do właściwości szerokości tła:

  • Pierwsza wartość określa rozmiar dla górnej i dolnej
  • Druga wartość określa rozmiar dla lewej i prawej strony

CSS

H1
Styl graniczny: solidny;
szerokość graniczna: 0.2 cm 0.1 cm;

P
Styl graniczny: solidny;
szerokość graniczna: 2px 1px;

Html

Szerokość granicy za pomocą predefiniowanych wartości


Pierwszy paragraf


Akapit drugi

Powyższy kod pokazuje następujące dane wyjściowe:

W wyjściowej wyjściu można zauważyć wyraźną różnicę w (górnych, dolnych) i (lewym, prawym).

Wniosek

Właściwość szerokości granicznej ustawia wszystkie cztery granice elementu. Jeśli właściwość szerokości granicznej ma jedną wartość, ustawi tę samą granicę na wszystkie cztery strony. W przypadku dwóch wartości pierwsza wartość odnosi się do „górnej i dolnej”, a drugie odnosi się do granic „lewej i prawej”. Jeśli istnieją trzy wartości, najpierw odnosi się do górnej granicy, druga odnosi się do lewej i prawej granicy, podczas gdy trzecia odnosi się do dolnej granicy. Jeśli istnieją cztery wartości, kolejność obróci się w kierunku obrotu zgodnie z ruchem wskazówek zegara i.mi. góra, prawy, dolny, lewy.

W tym artykule przedstawiono wytyczne dotyczące ustawienia szerokości granicznej przy użyciu predefiniowanych wartości i określonych wartości. Następnie ten zapis wyjaśnił, jak ustawić unikalny rozmiar granicy dla każdej strony.