Home  >  Article  >  Web Front-end  >  How to use CSS to add a double border effect to an image_html/css_WEB-ITnose

How to use CSS to add a double border effect to an image_html/css_WEB-ITnose

WBOY
WBOYOriginal
2016-06-24 11:39:002588browse

How to use CSS to add a double border effect to an image:

Adding double borders to an image also has many applications in actual use, which may not be frequent. Here is a simple Let’s introduce how to achieve this effect, so as to become proficient in the application of some CSS properties. Let’s look at a code example first:

<!DOCTYPE html><html><head><meta charset="utf-8"><meta name="author" content="http://www.51texiao.cn/" /><title>蚂蚁部落</title><style type="text/css">img{  border:5px solid #696;  padding:5px;  background-color:#CCC;}</style></head><body><img src="mytest/demo/dborder.jpg" alt="蚂蚁部落" /></body></html>

The above code achieves this effect by setting the border and padding of the a1f02c36ba31691bcfe87b2722de723b tag. In particular, many beginners often think that a1f02c36ba31691bcfe87b2722de723b is a content similar to text. In fact, it is not the case. It can be regarded as a container that can hold pictures (possibly although it is not accurate enough), and the inner border can be set for it. distance.

The original address is: http://www.51texiao.cn/div_cssjiaocheng/2015/0508/944.html

The most original address is: http://www.softwhy.com/ forum.php?mod=viewthread&tid=4690

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn