CSS, kad pagerintumėte vaizdų pateikimą

Norėdami pagerinti savo vaizdų pateikimą, į savo CSS galite įtraukti papildomą kodą. Jie yra lankstūs, priklausomai nuo to, ką norite pasiekti savo svetainėje.

Įgyvendinimas

Įdėkite norimus kodus CSS ir išbandykite savo puslapyje, pvz .:

Keletas pavyzdžių, kuriuos galima įdėti į CSS kodą

 .photo {fono spalva: #fafbfc; siena: 1px kietas # b0b0b0; paraštė: 0 0 10px 10px; paminkštinimas: 5px; } .phototoright {border: 5px kietas # b0b0b0; skirtumas: 5px 6px 15px 6px; } .phototoleft {border: 5px kietas # b0b0b0; plūdė: kairė; skirtumas: 5px 15px 6px 15 px; } 

Norėdami kadruoti vaizdą kairiuoju tekstu

 div # photoflot p {marža: 0; įdėklas: 0; teksto derinimas: pateisinti; } div # photoflot img {float: kairėje; fono spalva: #fafbfc; siena: 1px kietas # b0b0b0; paraštė: 0 0 10px 10px; paminkštinimas: 5px; } hr {aiškus: kairėje; } 

Naudokite jį kaip:

Fusce sem terpis, mollis ut, commodo quis, aliquet eget, ipsum. Ut nonummy libero vitae neque. Quisque lacus. Nullamo lobortas. Cras quam. Nulla vitae ante nec eros mollis luctus. Vivamus velit. Morbi interdum euismod sapien ...

Norėdami rėmelį atvaizduoti dešiniuoju tekstu

 / * Jei norite kadruoti vaizdą dešiniuoju tekstu * / .rightimg, .leftimg, .centreimg img {border: 1px solid #AAAAAA; fono spalva: # E9E9E9; įdėklas: 3px; skirtumas: 6px; } .rightimg {float: right;} .leftimg {float: left;} div.centreimg {text-align: center; } 

Naudokite jį kaip:

 Proin ac sapien et neque pellentesque mollis. Pražengęs kankintojas luctus pretium. Įkvėpimas. Nuncas ipsume. Suspendisse elit. „Fusce sit amet lectus“. „Quisque et neque vitae odio sagittis tincidunt tincidunt.Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed ac signalas. Nulla vel arcu. Proin ac sapien et neque pellentesque mollis ...