HTML基础 |
您所在的位置:网站首页 › 是英文的图片 › HTML基础 |
一、思维导图:
![]() ![]() ![]() ![]() ![]() ![]()
代码说明: 1、img标签中的img其实是英文image的缩写,所以 img标签的作用,就是告诉浏览器我们需要显示一张图片。
2、img标签格式: 其实img标签中的src是英文source的缩写,所以img标签中的src就是用来告诉img标签,需要显示的图片
3、注意点 - 和H系列的标签/p标签还有Hr标签不一样,img标签不会独占一行 - 使用width、height属性可能会使图片变形,想要等比例改变大小,可以只指定其中一个(宽度或高度),另一个会系统计算出来。 注释:图像的名称和尺寸是以属性的形式提供的。
4、属性: (1)width、height属性就是指定显示图片的宽度和高度若无指定,则系统按照指定的高度、宽度来显示 (2)title属性:用于告诉浏览器,当鼠标悬停在图片上时,需要弹出的描述框中显示什么内容 (3)alt:是alternate的缩写,它的作用就是用于告诉浏览器,当需要显示的图片找不到时显示什么内容 效果: 其实想给src属性赋值有两种方式: 1.通过相对路径赋值: 相对路径就是每次都从.html文件所在的文件夹开始查找,我们称之为相对路径。 1.1 *.html 文件跟 *.jpg 文件(同在f盘)在不同目录下:![]() 格式:src="图片名称.jpg" 含义:在.html文件所在的文件夹中查找名称叫做"xxx.jpg"的图片 即:*.html 文件跟 *.jpg 图片在相同目录下: ![]() 格式:src="images/xxx.jpg" 含义:在.html文件所在的文件夹中找到名称叫做images的文件夹,然后在images文件夹中找到名称叫做xxx.jpg的图片 即:图片 *.jpg 在 image 文件夹中,*.html 跟 image 在同一目录下: ![]() 格式:src="../xxx.jpg" 含义:在.html文件所在的文件夹中找到这个文件夹的上一级文件夹,然后再在上一级文件夹中找到名称叫做xxx.jpg的图片 其中“../”代表从当前的位置找到上一级文件夹 即:图片 *.jpg 在 image 文件夹中,*.html 在 connage 文件夹中,image 跟 connage 在同一目录下: ![]() 2.通过绝对路径赋值: 绝对路径就是每次都从指定的盘符开始查找. 格式:src="F:\学习资料\计算机学习资料\BS\HTML学习\花花.jpg"例如: ![]()
注意: 1.路径中不要出现中文,否则可能出现未知问题 2.如果是通过相对路径来指定,那么不能跨盘符
注意: 1.以后企业开发中如果需要编写路径,统一使用反斜杠"/",不要使用正斜杠“\”。因为将来我们开发的程序肯跟会部署到其他操作写鸥汀的服务器上,而在其他操作系统中共路径都是"/",所以如果你写的不是"/",可能会引发问题。 2.一般在企业开发中不会使用绝对路径,因为绝对路径的可移植性不好,代码拷贝发给别人之后,可能就不能打开了。 |
今日新闻 |
推荐新闻 |
CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3 |