CSS Height/Width

undo redo

Šta označava CSS Height/Width?

CSS Height/Width označava visinu ili širinu nekog elementa.

Da bi odredili visinu nekog elementa koristimo parametar Height.

Da bi odredili širinu nekog elementa koristimo parametar Width.

Visina i širina može biti određena na više načina. Ako postavimo parametar na auto, pretraživač će automatski odrediti visinu ili širinu elementa ( to je default vrijednost). Najčešće se određuje u nekoj dužinksoj vrijednosti npr. px itd. ili procentualno %.

Primjer 1

Ovaj element ima visinu 100px, a širinu 300px;

CSS

div {
   height: 100px;
   width: 300px;
   background-color: #4682B4;
}

<!DOCTYPE html>
<html>
<head>
<title>Hello</title>

<style>

div {
   height: 100px;
   width: 300px;
   background-color: #4682B4;
   color: #fff;
}

</style>


</head>
<body>

<div>Ovaj element ima visinu <b>100px</b>, a širinu <b>300px</b>.</div>

</body>
</html>

Primjer 2

Ovaj element ima visinu 50px, a širinu 50%;

CSS

div {
   height: 50px;
   width: 50%;
   background-color: #4682B4;
}

<!DOCTYPE html>
<html>
<head>
<title>Hello</title>

<style>

div {
height: 50px;
width: 50%;
background-color: #4682B4;
color: #fff;
}

</style>


</head>
<body>

<div>Ovaj element ima visinu <b>50px</b>, a širinu <b>50%</b>.</div>

</body>
</html>

Primjer 3

Ovaj element ima visinu 100px, a širinu 70%;

CSS

div {
   height: 100px;
   width: 70%;
   background-color: #4682B4;
}

<!DOCTYPE html>
<html>
<head>
<title>Hello</title>

<style>

div {
height: 100px;
width: 70%;
background-color: #4682B4;
color: #fff;
}

</style>


</head>
<body>

<div>Ovaj element ima visinu <b>100px</b>, a širinu <b>70%</b>.</div>

</body>
</html>

undo redo

w3sedic

CSS

CSS Height/Width