tekoms-doo

"Prišiveni" Div tag

English

tekoms-web-dizajn

 

 

Nazad

Efekat "prišivenog" Div tag-a se veoma jednostavno može dizajnirati preko stilova i definisanja tačkaste bordure oko div taga. Ovakav efekat kod dizajna se može primeniti na primer kod sajtova koji se bave prodajom ili proizvodnjom tekstila gde svi elementi u konstrukciji web strane deluju kao da su "prišiveni". Na taj način daje se neka vrsta originalnosti dizajnu kao i jedinstveno rešenje web strane. Umesto obojene pozadine div taga može da se ubaci na primer tekstura džinsa. Svakako takav dizajn kroz detalje ostavlja pozitivan utisak.

Head


<style type="text/css">
.stitched {
   padding: 20px;
   background: #2f69bb;
   color: #fff;
   line-height: 1.3em;
   border: 2px dashed #fff;
   border-radius: 10px;
   box-shadow: 0 0 0 4px #2f69bb, 2px 1px 6px 4px rgba(10, 10, 0, 0.5);
   text-shadow: -1px -1px #000;
   font-family: Tahoma;
}
</style>

Body


<div class="stitched">
	<h1 style="text-align: center;"> "Prišiven" Div Tag </h1>
</div>

Prikaz u Browser-u


"Prišiven" Div Tag