Rumah >hujung hadapan web >Soal Jawab bahagian hadapan >Css如何插入图片
Css如何插入图片
- 藏色散人asal
- 2021-04-25 09:36:1099813semak imbas
Css插入图片的方法：首先创建一个HTML示例文件；然后在body中创建一个div；最后通过设置“background-image: url(1.jpg);”样式实现插入图片即可。
本文操作环境：windows7系统、HTML5&&CSS3版、Dell G3电脑。
在css中，可以使用background-image属性添加图片。background-image属性为元素设置背景图像。初始背景图像（原图像）根据background-position属性的值放置。
元素的背景占据了元素的全部尺寸，包括内边距和边框，但不包括外边距。默认地，背景图像位于元素的左上角，并在水平和垂直方向上重复。
提示：请设置一种可用的背景颜色，这样的话，假如背景图像不可用，页面也可获得良好的视觉效果。
详细说明
background-image 属性会在元素的背景中设置一个图像。根据 background-repeat 属性的值，图像可以无限平铺、沿着某个轴（x 轴或 y 轴）平铺，或者根本不平铺。
初始背景图像（原图像）根据 background-position 属性的值放置。
属性值：
url('URL') 指向图像的路径。
none 默认值。不显示背景图像。
【推荐学习：css视频教程】
示例：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style type="text/css">
div{
width: 400px;
height: 300px;
border: 1px solid red;
}
.img1{
background-image: url(1.jpg);
background-size: 200px;
}
</style>
</head>
<body>
<div class="img1"></div>
</body>
</html>效果图：
Atas ialah kandungan terperinci Css如何插入图片. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!
Kenyataan：
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel sebelumnya：css怎么改变背景色Artikel seterusnya：css如何让图片旋转