Albanian CodersAlbanian Coders

Albanian Coders Community!

CSS float

01.12.2010 · Kategoriler CSS

Pershendetje,
ne kete mesim te shkurter por aq i vlefshem dua te tregoj komanden float ne css se per cfare sherben dhe si perdoret.
Komanda float ne CSS nevojitet per te mbeshtetur dicka ose div tek e djathta ose e majta.Ose duhet per ti vendosur Div-et anash anash me njeratjetren

Tani ne faqen HTML kemi 2 div djathtas dhe majtas.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

<html>
<head>
   <title>Perdorimi i float ne CSS</title>
    <link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
 
<div id="majtas">
E majta
</div>
 
<div id="djathtas">
E djathta
</div>
 
 
</body>
</html>

Dhe dokumenti CSS eshte keshtu;

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

#majtas {
    font-family: Tahoma;
    font-size: 20px;
   background-color: gray;
    width: 100px;
   height: 100px;
}
 
#djathtas {
   font-family: Comic Sans MS;
   font-size: 12px;
    background-color: red;
    width: 100px;
    height: 100px;
}

Tani do mundohemi qe divin djathtas ta vendosim anash tjetrit qe e quajtem majtas.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22

<html>
<head>
   <title>Perdorimi i float ne CSS</title>
    <link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
 
<div id="kryesor">
 
<div id="majtas">
E majta
</div>
 
<div id="djathtas">
E djathta
</div>
 
</div>
 
 
</body>
</html>

Me pas ne CSS duke i dhene gjeresini dhe gjatesine do e kufizojme.Dhe divin qe e quajtem djathtas

1

float: right;

do e mbeshtesim djathtas me kodin qe dhash me larte.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

#kryesor {
     width: 200px;
     height: 100px;
}
 
#majtas {
    font-family: Tahoma;
    font-size: 20px;
   background-color: gray;
    width: 100px;
   height: 100px;
}
 
#djathtas {
   font-family: Comic Sans MS;
   font-size: 12px;
    background-color: red;
    width: 100px;
    height: 100px;
    float: right;
}

E rendesishme: Div qe i vendosem komanden float gjithmon duhet te vije perpara divit qe nuk ja kemi vendosur kete komande.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22

<html>
<head>
     <title>Perdorimi i float ne CSS</title>
     <link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
 
<div id="Kryesor">
 
<div id="djathtas">
E djathta
</div>
 
<div id="majtas">
E majtas
</div>
 
</div>
 
 
</body>
</html>

Yorumunuzu yaziniz

A.C