📅  最后修改于: 2023-12-03 15:14:21.396000             🧑  作者: Mango
CSS可以为图片添加文字、边框、背景等装饰效果,使得图片更加丰富多彩。下面是一些常用的方法。
可以通过在<img>
标签的后面添加<figcaption>
标签,为图片添加文字描述。示例代码如下:
<figure>
<img src="example.jpg" alt="Example">
<figcaption>This is an example image.</figcaption>
</figure>
通过CSS的border
属性,可以为图片添加边框。示例代码如下:
<img src="example.jpg" alt="Example" style="border: 2px solid black;">
可以为图片周围添加背景颜色或背景图片。示例代码如下:
<img src="example.jpg" alt="Example" style="padding: 10px; background-color: gray;">
<img src="example.jpg" alt="Example" style="padding: 10px; background-image: url(bg.png);">
通过CSS的box-shadow
属性,可以为图片添加阴影效果。示例代码如下:
<img src="example.jpg" alt="Example" style="box-shadow: 5px 5px 5px black;">
以上是CSS在图片旁边添加一些东西的方法,您可以根据需要进行使用。