Home > Web Front-end > HTML Tutorial > 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
Release: 2016-06-24 11:39:00
Original
2619 people have browsed it

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>
Copy after login

The above code achieves this effect by setting the border and padding of the tag. In particular, many beginners often think that 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

source:php.cn
Statement of this Website
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
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template