CSS за подобряване на представянето на вашите изображения

За да подобрите представянето на вашите изображения, можете да включите допълнителен код в CSS. Те са гъвкави в зависимост от това, което искате да постигнете на вашия сайт.

изпълнение

Поставете желаните CSS кодове и тествайте в страницата си така:

Някои примери за поставяне в CSS кода

 .photo {цвят на фона: #fafbfc; граница: 1px твърдо # b0b0b0; марж: 0 0 10px 10px; подложка: 5px; } .phototoright {border: 5px solid # b0b0b0; марж: 5px 6px 15px 6px; } .phototoleft {border: 5px solid # b0b0b0; поплавък: наляво; марж: 5px 15px 6px 15 px; } 

За да направите рамката на изображение с текст вляво

 div # photoflot p {margin: 0; подложка: 0; текст-приравни: обоснове; } div # photoflot img {float: left; фон-цвят: #fafbfc; граница: 1px твърдо # b0b0b0; марж: 0 0 10px 10px; подложка: 5px; } hr {ясно: наляво; } 

Използвайте го като такъв:

Fusce sem turpis, mollis ut, commodo quis, пайетки, eget, ipsum. Това е невъзможно либерално животно. Quisque lacus. Nullam lobortis. Cras quam. Nulla vitae ante nec eros mollis luctus. Vivamus velit. Morbi interdum euismod sapien ...

Да начертаете изображение с текст вдясно

 / * За да направите кадър с изображение вдясно * / .rightimg, .leftimg, .centreimg img {border: 1px solid #AAAAAA; фон-цвят: # E9E9E9; подложка: 3px; марж: 6px; } .liftimg {float: right;} .leftimg {float: left;} div.centreimg {text-align: център; } 

Използвайте го като такъв:

 Proin ac sapien et neque pellentesque mollis. Визуализирайте великолепния тортор луктус претиум. Проинтегриран е с гравита дуе пенталенс. Nunc at ipsum. Суспендиращ елит. Fusce sit amet lectus. Quisque и neque vitae odio sagittis tincidunt.Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Седалки. Nulla vel arcu. Proin ac sapien et neque pellentesque ...