Centrirani naslov

Popularno još od starih UI dana a dobar način za odvajanje grupa HTML elemenata.

Demo:

TITLE WITH LINE

Kod:

<style>
.ds-line-title
{
	text-align:center;
    width:100%;
    display: block;
    height:100%;
    background-size: cover;
    background-repeat: no-repeat;	
}

.ds-line-title h1 {
    position:relative;
    display:inline-block;
}
.ds-line-title h1::before, .ds-line-title h1::after {
    content:' ';
    display:block;
    position:absolute; top:50%; left:-120px;
    width:100px;
    border-bottom:1px solid gray;
}
.ds-line-title h1::after {
    left:auto; right:-120px;
}
</style>


<div class='ds-line-title'>
  <h1>TITLE WITH LINE</h1>
</div> 

Odgovori

Vaša adresa e-pošte neće biti objavljena. Obavezna polja su označena sa * (obavezno)

Previous post Zzzz pčelica
Next post Inkscape 2 HTML

🗣 You can translate this site using Chrome built-in translator.