☰ Dersleri Göster

Text align - Metin hizalaması

Text align - Metin hizalaması

Kursa 27.99 TL'ye kayıt olmak için TIKLAYINIZ.

 

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Text align - Metin Hizalama</title>
   
    <style>
	div{
	border:1px solid red;
	}
	div.center {
	  text-align: center;
	}

	div.left {
	  text-align: left;
	}

	div.right {
	  text-align: right;
	}

	div.justify {
	  text-align: justify;
	}
    p{
        border:1px solid red;
        height: 300px;
    }
    .uzunMetin{
    display: table-cell;
    vertical-align: top;
	
    }
    .kisaMetin{
        display: table-cell;
        vertical-align: bottom;
    }
    </style>
</head>
<body>
    
<p class="uzunMetin">Lorem ipsum dolor sit, amet consectetur adipisicing.
    Lorem ipsum dolor sit, amet consectetur adipisicing.
    Lorem ipsum dolor sit amet consectetur adipisicing.
    Lorem ipsum dolor sit, amet consectetur adipisicing.
    Lorem ipsum dolor sit, amet consectetur adipisicing.
    Lorem ipsum dolor sit amet consectetur adipisicing.
    Lorem ipsum dolor sit, amet consectetur adipisicing.
    Lorem ipsum dolor sit, amet consectetur adipisicing.
    Lorem ipsum dolor sit amet consectetur adipisicing.
</p>
<br>
<p class="kisaMetin">Lorem ipsum dolor sit amet.</p>
<br>
<div class="left"> Naber </div>
<br>
<div class="right"> Naber </div>
<br>
<div class="center"> Naber </div>
<br>
<div class="justify">
Lorem ipsum dolor sit amet consectetur adipisicing.
    Lorem ipsum dolor sit, amet consectetur adipisicing.
    Lorem ipsum dolor sit, amet consectetur adipisicing.
    Lorem ipsum dolor sit amet consectetur adipisicing.
    Lorem ipsum dolor sit, amet consectetur adipisicing.
    Lorem ipsum dolor sit, amet consectetur adipisicing.
    Lorem ipsum dolor sit amet consectetur adipisicing.
</div>

</body>
</html>