图片之间的间隔css怎么设置

藏色散人
Freigeben: 2023-01-04 09:38:30
Original
10318 Leute haben es durchsucht

css设置图片之间的间隔的方法:首先新建一个html文件;然后创建一个div,并在div内使用img标签创建两张图片;最后使用margin属性设置两张图片之间的距离即可。

图片之间的间隔css怎么设置

本教程操作环境:Dell G3电脑、Windows7系统、HTML5&&CSS3版本。

推荐:《css视频教程

css设置两个图片之间的距离的方法

新建一个html文件,命名为test.html,用于讲解css中如何设置两个图片之间的距离。

72e616868374ff4c944a440f35bd45a.png

在test.html文件内,创建一个div,并设置其class属性为dd,用于下面对div进行css样式设置。

059ef8fed8df23e4901cdd6dd1c9fc8.png

在div内,使用img标签创建两张图片,图片名称分别为1.jpg,3.jpg。

6701d69302a5c8fd6d03053b2d580d6.png

为了展示明显的效果,对div进行样式设置。设置div宽度为600px,高度为500px,居中显示,同时设置1px灰色边框。

d69cc16bc1d0465324729f28e61009e.png

在test.html文件内,使用margin属性设置两张图片之间的距离。例如,设置1.jpg图片距离3.jpg图片30px,可以使用margin-right属性进行设置。

61c3a202a852ba323ea41dd60225dd6.png

Das obige ist der detaillierte Inhalt von图片之间的间隔css怎么设置. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
css
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!