Praneškite apie mus:


CSS plaukiojantys elementai - float

Įvertink
(0 balsai)
1 1

Float parametras nurodo elementų plaukiojimą apgal kairę arba pagal dešinę pusę. Plaukiojimą nutraukia parametras clear. Plaukioti gali tik elementai, kurių poistion parametro reikšmė yra static arba relative. Plaukiojantys elementai naudojami dažnai, su jais galime kurti viso puslapio išdėliojimą, paveikslėlių galerijas, įterpti paveikslėlius į teksta ir kt.

Paveikslų galerija su plaukiojančiais elementais

1
2
3
4
5
6
7
8
9
10
11
img {
width:50px;
height:50px;
position:relative;
background-color: #32c3ef;
margin: 10px;
float:left;
}
h2 {
clear:left;
}

pabandyk_pats

 

Plaukiojantis paveiksliukas tekste

Dažnai kartu su tekstu yra pateikiami ir paveikslėliai, float parametras čia yra iš ties patogus.

1
2
3
img {
float:right;
}

 

pabandyk_pats

 

Puslapio išdėliojimas su plaukiojančiais elementais

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
#container {
width:700px;
position:absolute;
background-color:#CFC;
border:1px solid #900;
float:none;
}
 
.float {
float:left;
text-align:left;
}
 
#k_meniu {
width: 150px;
height:150px;
background-color:#CCC;
}
 
#straipsnis {
width: 400px;
height:350px;
background-color:#0C6;
}
 
#d_meniu {
width: 150px;
height:150px;
background-color:#FC9;
}

pabandyk_pats


Atnaujinimo Data: Ketvirtadienis, Birželio 10, 2010
Lukas

Lukas

Manualai.lt tinklo autorius ir administratorius. VDU Energetikos Fizikos ir Verslo Informatikos studentas. LinkedIn

E-mail: Šis el. pašto adresas yra apsaugotas nuo spam botų. Jum reikalingas įjungtas Javasctipt kad jį matytumėte
Login to post comments