Uzziniet, kā ar CSS apvilkt tekstu ap peldošu attēlu.
Lai teksts apvilktos ap attēlu labajā pusē, līdzīgi kā tas ir fotoattēlā, kas ievada šo rakstu, izmantojiet šādu CSS kārtulu:
Peldīšanas: kreisais kārtula liek attēlam pārvietoties uz kreiso malu. Labās aizpildīšanas noteikums neļauj tekstam sasist tieši pret attēla labo pusi. Ja šim attēlam pievienotu apmali, starp attēlu un apmali tiktu ievietots polsterējums. Lai strādātu ar attēlu ar apmali, skatiet 2. sadaļu.
Pēc tam pievienojiet piemales attēla kreisajā un labajā pusē, lai to centrētu. Kreisās un labās piemales pareizā vērtība, lai kaut ko centrētu, ir automātiska.
Lai izveidotu biezu, rāmim līdzīgu apmali, izmantojot rievas apmales stilu, var izmantot šādu noteikumu:
Citi apmales stili ir vienkrāsains, punktēts, svītrots, dubultā, izciļņa, ielaiduma un sākuma. Platumu var izteikt pikseļos, ems vai procentos.
Apmales var lietot selektīvi attēla augšpusē, labajā pusē, apakšā un kreisajā pusē. Varat izmantot šīs zināšanas, lai radītu tādu efektu kā ēna.
Izmantojot stingru apmali 2 pelēkos toņos tikai labajā un apakšējā malā, jūs iegūstat ēnu efektu.
img { peldēt: pa kreisi; apmales-labais stils: ciets; apmale-labais-platums: 8px; apmale-labā krāsa: #CCCCCC; apmales-bottom-style: solid; apmales apakšas platums: 8 pikseļi; apmales-bottom-color: #999999; mala-labā: 1em; piemale-apakšā: 1em; }
Padoms
Ja jums ir attēli vairāk nekā vienā lapas daļā (div), izmantojiet pēcteču atlasītājus, lai veidotu tos atsevišķi. Iespējamie atlasītāji: #content img, #sidebar img, #feature img.
