Inne działy

 

 

CSS właściwość border-width

 

Definicja i Wykorzystanie

 

Właściwość border-width określa szerokość czterech krawędzi elementu. Ta właściwość może mieć od jednej do czterech wartości.

Przykłady:

 

  • border-width:thin medium thick 10px;
    • górna krawędź jest thin (cienka)
    • prawa krawędź jest medium (średnia)
    • dolna krawędź jest thick (gruba)
    • lewa krawędź ma 10px
  • border-width:thin medium thick;
    • górna krawędź jest thin
    • prawa i lewa krawędź jest medium
    • dolna krawędź jest thick
  • border-width:thin medium;
    • górna i dolna krawędź jest thin
    • prawa i lewa krawędź jest medium
  • border-width:thin;
    • wszystkie cztery krawędzie są thin

Właściwość border-width jest obsługiwana przez wszystkie główne przeglądarki.

Uwaga: wartość "inherit" nie jest obsługiwana w IE7 i wcześniejszych. IE8 wymaga !DOCTYPE. IE9 obsługuje "inherit" (dziedziczenie).

 

WartośćOpis
thin Określa górną cienką krawędź
medium Określa średnią górną krawędź. Jest to ustawienie domyślne
thick Określa grubą krawędź górną
length Pozwala zdefiniować grubość górnej krawędzi
inherit Określa, że szerokość krawędzi powinna być dziedziczona z elementu nadrzędnego

 

Przykład

div.border-width {border-width:thin medium thick 30px}

 

Przykład

<style type="text/css">
div.styled {
border-width:thin medium thick 30px;
border-color:#ff9900;
border-style:solid;
}
</style>
<div class="styled">Ten "div" używa właściwość CSS border-width .
Próbuj zmieniać wartości, aby sprawdzić, że mają wpływ na
krawędzie każdego boku div.
</div>

 

Przykład 

<!DOCTYPE html>
<html>
<head>
<style>
p.one
{
border-style:solid;
border-width:5px;
}
p.two
{
border-style:solid;
border-width:medium;
}
p.three
{
border-style:solid;
border-width:1px;
}
</style>
</head>

<body>
<p class="one">Przykładowy tekst.</p>
<p class="two">Przykładowy tekst.</p>
<p class="three">Przykładowy tekst.</p>
<p><b>Note:</b> Własność "border-width" nie działa, jeśli jest stosowana samodzielnie.
Użyj własność "border-style" aby ustawić najpierw krawędzie.</p>
</body>

</html>

 

Zobacz nasze wszystkie kursy

WWW


HTML
HTML - Znaczniki
CSS - Tutorial
CSS - Selektory
PHP
JavaScript

XML

XSLT

Bazy danych


SQL
SQLite
MySQL
PostgreSQL

 

 

Programowanie


C
C++
C#
Java
VisualBasic
Python

Linux


Podstawy Linuxa
Bash
Linuks artykuły

Windows


Excel funkcje
Windows wskazówki
Outlook

Pozotałe działy


Programy
Rozrywka

 

 

 

This email address is being protected from spambots. You need JavaScript enabled to view it.