CSS рамки для изображений и текста
Хотите добавить рамку к изображению на сайте? С помощью CSS сделать это очень просто. Для этогоиспользуется параметр border тега <IMG>. По умолчанию рамка вокруг изображения не отображается, за исключением случая, когда рисунок является ссылкой. Цвет рамки при этом совпадает с цветом текста, заданным с помощью стиля страницы или параметра text тега <BODY>. В качестве значения указывается толщина границы, ее стиль и цвет. Например, для создания сплошной рамки толщиной два пиксела красного цвета необходимо записать IMG {border: 2px solid #ff0000;}.
По такому же принципу, изменяя значения, вы можете задать рамку на свой вкус.
<img src="bild.gif" style="border-style: dotted; border-width: 7px; border-color: #99CCFF;">
<img src="bild.gif" style="border-style: outset; border-width: 7px; border-color: gold;">
<img src="bild.gif" style="border-style: inset; border-width: 7px; border-color: gold;">
<img src="bild.gif" style="border-style: groove; border-width: 7px; border-color: gold;">
Сокращаем CSS-значения
Что бы задать рамку достаточно сокращённых CSS-значений.
<img src="bild.gif" style="border: double 5px deeppink">
<img src="bild.gif" style="border: dashed 2px #FF4500">
<img src=bild.gif" style="border: ridge 15px #FFFF42;">
Рамки для текста
Рамки для текста задаются по такому же принципу, только тэг <img> заменяем на <div>
<div style="border: dotted 2px #FFD700">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum ...</div>
<div style="border: ridge 15px #FFFF42;">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum, ...</div>
