CSS, lai uzlabotu jūsu attēlu prezentāciju

Lai uzlabotu savu attēlu prezentāciju, savā CSS varat iekļaut papildu kodu. Tie ir elastīgi atkarībā no tā, ko vēlaties sasniegt savā vietnē.

Īstenošana

Ievietojiet vēlamos kodus CSS un pārbaudiet savā lapā, piemēram:

Daži piemēri, kas ievietojami CSS kodā

 .photo {fona krāsa: #fafbfc; robeža: 1px cietais # b0b0b0; starpība: 0 0 10px 10px; polsterējums: 5px; } .phototoright {border: 5px ciets # b0b0b0; starpība: 5px 6px 15px 6px; } .phototoleft {border: 5px solid # b0b0b0; peldēt: pa kreisi; starpība: 5px 15px 6px 15 px; } 

Lai attēlotu attēlu ar tekstu pa kreisi

 div # photoflot p {starpība: 0; polsterējums: 0; teksta saskaņošana: pamatot; } div # photoflot img {float: pa kreisi; fona krāsa: #fafbfc; robeža: 1px cietais # b0b0b0; starpība: 0 0 10px 10px; polsterējums: 5px; } hr {skaidrs: pa kreisi; } 

Izmantojiet to kā tādu:

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

Lai attēlotu attēlu ar tekstu pa labi

 / * Lai attēlotu attēlu ar tekstu pa labi * / .rightimg, .leftimg, .centreimg img {border: 1px solid #AAAAAA; fona krāsa: # E9E9E9; polsterējums: 3px; starpība: 6px; } .rightimg {float: right;} .leftimg {float: left;} div.centreimg {text-align: centrs; } 

Izmantojiet to kā tādu:

 Proin ac sapien et neque pellentesque mollis. Prezentējošais jaunais tortors luctus pretium. Proin a est gravida dui pellentesque tincidunt. Nunc at ipsum. Suspendisse elit. Fusce sit amet lectus. Neapstrādāts un neque vitae odio sagittis tincidunt.Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed ac tellus. Nulla vel arcu. Proin ac sapien et neque pellentesque mollis ... 

Iepriekšējais Raksts Nākamais Raksts

Top Padomi