怎么在css中插入图片

怎么在css中插入图片,第1张

css插入图片方法如下:

*** 作设备:戴尔笔记本电脑

*** 作系统:win10

*** 作程序:html编辑器v8.21

1、打开html编辑器并创建一个新的html文件。

2、新建完一个新的html文件后,在index.html的<style>标签中,输入如下所示的CSS代码。

3、输入完CSS代码之后,接下来运行index.html页面,可以发现,本地图片通过背景图片衜中的本地路径成功调用为了背景图片,图片就成功加入了。

css写绝对路径的方法:首先查看本地项目目录;然后引入图片,并输入绝对路径如“background:url(E:/py_web/python/module/static/img/bg.png);”即可。

.a{background-image:url(图片路径)}

图片路径可以是绝对路径、根相对路径和文档相对路径

绝对路径是包括服务器协议的完全路径,比如“百度主页”,完全路径为:http://www.baidu.com/index.htm,如果所要链接当前站点之外的文档,就必须使用绝对路径。

相对路径包括根相对路径(Site

Root)和文档相对路径(Document)两种。

根相对路径(也称相对跟目录)的路径以“/”开头,路径是从当前站点的根目录开始计算。比如我们前面建的D盘myweb目录就是名为“myweb”的站点,这时“/index.htm”

路径,就表示文件位置为D:\myweb\index.htm。根相对路径适用于链接内容频繁更换环境中的文件,这样即使站点中的文件被移动了,其链接仍可以生效。

文档相对路径就是指包含当前文档的文件夹,也就是以当前网页所在文件夹为基础开始计算路径。比如,当前网页所在位置为

D:\myweb\mypic,那么:

“a.htm”就表示

D:\myweb\mypic\a.htm;

“../a.htm”相当于

D:\myweb\a.htm,其中“../”表示当前文件夹上一级文件夹。

“img/a.gif”是指

D:\myweb\mypic\img\a.gif,其中“img/”意思是当前文件夹下名为

img

文件夹。

文档相对路径是最简单的路径,一般多用于链接保存在同一文件夹中的文档。

换成图片路径也是

一样的道理


欢迎分享,转载请注明来源:内存溢出

原文地址: https://outofmemory.cn/bake/11864252.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-19
下一篇 2023-05-19

发表评论

登录后才能评论

评论列表(0条)

保存