0
点赞
收藏
分享

微信扫一扫

【web前端笔记】尚硅谷web前端零基础入门HTML5+CSS3基础教程(李立超 超哥)笔记 P23图片标签

追风骚年 2022-03-26 阅读 84

图片标签

图片标签用于向当前页面引入一个外部图片
在这里插入图片描述
使用img标签来引入外部图片,img标签是一个自结束标签
img这种元素属于替换元素(基于块和行内元素之间),具有两种元素的特点
img标签我们在审查元素的时候是看不到实体图片的,看到的只是它的src,浏览器根据src来显示内容,所以说它是一个替换元素

属性:
src属性指定的是外部图片的路径(路径规则和超链接是一样的)

alt属性指的是如片的描述,这个描述默认情况下不会显示,有些浏览器会在图片无法加载时显示
(比如说这张图片因为某些原因无法显示了,就会提示给用户alt属性中的内容)
在这里插入图片描述
在这里插入图片描述

搜索引擎会根据alt中的内容来识别图片
如果不写alt属性则不会被搜索引擎所收录

比如说我在搜索引擎中搜索“清纯美女”
在这里插入图片描述

那么,搜索引擎就是根据图片的alt的属性来搜索的
比如说随便打开一张我喜欢的 图片,看一下它的源代码
在这里插入图片描述
我大意了啊,它写到title标签和meta标签的content属性里边了……

不管了,你理解就好

其他属性:
width: 图片的宽度
height: 图片的高度

宽度和高度如果只修改了一个,则另一个会等比例缩放

注意:
一般情况下,在PC端不建议修改图片的大小,需要多大的图片就裁多大
但是在移动端经常需要对图片进行缩放(大图缩小)

举报

相关推荐

0 条评论