2. Start
  3. Nauka
  4. Materiały dodatkowe
  5. CSS
  6. 08a. Obramowanie - styl
Materiały dodatkowe
CSS

08a. Obramowanie - styl

CSS Wynik działania
1. Styl obramowania dotted 
p
   {
      border-style:dotted
   }

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras eu dolor turpis. Nulla facilisi. Maecenas viverra id dolor vel hendrerit. Integer sed pulvinar leo, vitae venenatis enim.
2. Styl obramowania dashed 
p
   {
      border-style:dashed
   }

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras eu dolor turpis. Nulla facilisi. Maecenas viverra id dolor vel hendrerit. Integer sed pulvinar leo, vitae venenatis enim.
3. Styl obramowania solid 
p
   {
      border-style:solid
   }

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras eu dolor turpis. Nulla facilisi. Maecenas viverra id dolor vel hendrerit. Integer sed pulvinar leo, vitae venenatis enim.
4. Styl obramowania double 
p
   {
      border-style:double 
   }

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras eu dolor turpis. Nulla facilisi. Maecenas viverra id dolor vel hendrerit. Integer sed pulvinar leo, vitae venenatis enim.
5. Styl obramowania groove. Styl obramowania 3D. Efekt lepiej widoczny przy szerszych obramowaniach 
p
   {
      border-style:groove;
      border-width:10px;
   }

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras eu dolor turpis. Nulla facilisi. Maecenas viverra id dolor vel hendrerit. Integer sed pulvinar leo, vitae venenatis enim.
6. Styl obramowania ridge. Styl obramowania 3D. 
p
   {
      border-style:ridge;
   }

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras eu dolor turpis. Nulla facilisi. Maecenas viverra id dolor vel hendrerit. Integer sed pulvinar leo, vitae venenatis enim.
7. Styl obramowania ridge. Styl obramowania 3D. Efekt lepiej widoczny przy szerszych obramowaniach 
p
   {
      border-style:ridge;
      border-width:10px
   }

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras eu dolor turpis. Nulla facilisi. Maecenas viverra id dolor vel hendrerit. Integer sed pulvinar leo, vitae venenatis enim.
8. Styl obramowania inset. Styl obramowania 3D. Efekt lepiej widoczny przy szerszych obramowaniach 
p
   {
      border-style:inset;
      border-width:10px
   }

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras eu dolor turpis. Nulla facilisi. Maecenas viverra id dolor vel hendrerit. Integer sed pulvinar leo, vitae venenatis enim.
9. Styl obramowania outset. Styl obramowania 3D. Efekt lepiej widoczny przy szerszych obramowaniach 
p
   {
      border-style:outset;
      border-width:10px
   }

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras eu dolor turpis. Nulla facilisi. Maecenas viverra id dolor vel hendrerit. Integer sed pulvinar leo, vitae venenatis enim.
10. Styl obramowania none - brak obramowania 
p
   {
      border-style:none;
   }

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras eu dolor turpis. Nulla facilisi. Maecenas viverra id dolor vel hendrerit. Integer sed pulvinar leo, vitae venenatis enim.
11. Styl obramowania hidden - obramowanie ukryte 
p
   {
      border-style:hidden;
   }

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras eu dolor turpis. Nulla facilisi. Maecenas viverra id dolor vel hendrerit. Integer sed pulvinar leo, vitae venenatis enim.
11. Styl obramowania - mieszany 
p
   {
      border-top-style:dotted;
      border-bottom-style:solid;
   }

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras eu dolor turpis. Nulla facilisi. Maecenas viverra id dolor vel hendrerit. Integer sed pulvinar leo, vitae venenatis enim.
12. Styl obramowania - mieszany 
p
   {
      border-top-style:dotted;
      border-left-style:double;
      border-bottom-style:solid;
      border-right-style:dashed;
   }

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras eu dolor turpis. Nulla facilisi. Maecenas viverra id dolor vel hendrerit. Integer sed pulvinar leo, vitae venenatis enim.
13. Styl obramowania - mieszany 
p
   {
      border-style:dotted;
   }

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras eu dolor turpis. Nulla facilisi. Maecenas viverra id dolor vel hendrerit. Integer sed pulvinar leo, vitae venenatis enim.
14. Styl obramowania - mieszany 
p
   {
      border-style:dotted dashed;
   }

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras eu dolor turpis. Nulla facilisi. Maecenas viverra id dolor vel hendrerit. Integer sed pulvinar leo, vitae venenatis enim.
15. Styl obramowania - mieszany 
p
   {
      border-style:dotted dashed double;
   }

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras eu dolor turpis. Nulla facilisi. Maecenas viverra id dolor vel hendrerit. Integer sed pulvinar leo, vitae venenatis enim.
16. Styl obramowania - mieszany 
p
   {
      border-style:dotted dashed double solid;
   }

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras eu dolor turpis. Nulla facilisi. Maecenas viverra id dolor vel hendrerit. Integer sed pulvinar leo, vitae venenatis enim.
Rating:
( 0 Rating )

Menu