Autor publikacji
Virtual Patriot - Administrator

outline-width

Data publikacji
Ostatnio edytowano

Przeznaczenie właściwości outline-width

Za pomocą właściwości outline-width możemy określić rozmiar grubości obrysu interesującego nas elementu HTML.

Informacje dodatkowe

gdy stylem obrysu elementu HTML jest styl none lub hidden, wtedy rozmiarem grubości obrysu elementu HTML jest zawsze rozmiar 0

Informacje techniczne o właściwości outline-width

przeznaczenie

element HTML każdego typu

pozycja

dowolna

dziedziczenie

nie

wartość initial

medium

wyjątki initial

a

animowanie

tak

Interpretacja właściwości outline-width

Firefox

tak

Google Chrome

tak

Safari

tak

Opera

tak

Internet Explorer

tak

Edge

tak

Opis wartości właściwości outline-width

rozmiar

Wyjaśnienie

Za pomocą właściwości outline-width oraz dowolnej nieujemnej liczby wraz z wybraną jednostką absolutną lub jednostką relatywną możemy określić rozmiar grubości obrysu interesującego nas elementu HTML.

Przykład

  outline-width:10px;
rozmiar grubości obrysu tego elementu "div" wynosi 10 pikseli, ponieważ do tego elementu "div" została dodana właściwość "outline-width" wraz z wartością "10px"

Kod źródłowy przykładu

<!DOCTYPE HTML>
<html>
  <head>
    <meta charset="utf-8">
    <title>Darmowy Kurs CSS</title>

    <style>
      html {
        font-size:16px;
        font-family:Helvetica, sans-serif;
      }

      div {
        outline-width:10px;
        outline-style:solid;
        outline-color:black;
        padding:1em;
        font-size:1.3em;
        background-color:#7DCDE8;
      }
    </style>
  </head>

  <body>

    <div>
      rozmiar grubości obrysu tego elementu "div" wynosi 10 pikseli, ponieważ do tego elementu "div" została dodana właściwość "outline-width" wraz z wartością "10px"
    </div>

  </body>
</html>

grubość linii

Wyjaśnienie

Za pomocą właściwości outline-width oraz dowolnej dostępnej wartości grubości linii możemy określić rozmiar grubości obrysu interesującego nas elementu HTML.

różne wartości rozmiaru grubości linii

Porównanie wartości rozmiaru grubości linii występujących w języku CSS.

Przykład

  outline-width:thin;
rozmiarem grubości obrysu tego elementu "div" jest rozmiar cienki, ponieważ do tego elementu "div" została dodana właściwość "outline-width" wraz z wartością "thin"

Kod źródłowy przykładu

<!DOCTYPE HTML>
<html>
  <head>
    <meta charset="utf-8">
    <title>Darmowy Kurs CSS</title>

    <style>
      html {
        font-size:16px;
        font-family:Helvetica, sans-serif;
      }

      div {
        outline-width:thin;
        outline-style:solid;
        outline-color:black;
        padding:1em;
        font-size:1.3em;
        background-color:#7DCDE8;
      }
    </style>
  </head>

  <body>

    <div>
      rozmiarem grubości obrysu tego elementu "div" jest rozmiar cienki, ponieważ do tego elementu "div" została dodana właściwość "outline-width" wraz z wartością "thin"
    </div>

  </body>
</html>