从零开始前端学习[2]:img标签的使用
来源:互联网 发布:熊族软件下载 编辑:程序博客网 时间:2024/05/23 02:03
从零开始前端学习[2]:img标签的使用
- img标签的相关属性
- img标签的使用
提示
作者:章飞_906285288
博客地址:http://blog.csdn.net/qq_29924041
img标签的相关属性
img标签介绍
img标签是前端页面中用来加载图像,图片的,当时有时候我们也不一定会使用img来进行图片的加载操作,而会使用background来作为背景添加上,但是img图片的使用,没有了图片的页面能叫前端么??
特点:
img标签是一个单标签,即<img/>而不是<img></img>这样一个对应结尾的部分
//简单的使用方式: <img src="../a.png" width="300px" height="200px" alt="图片加载失败的时候的文字" title="鼠标放在图片上显示的文字"/>
img标签的属性
img的标签属性有以下一种
- src属性: <img src=”图片加载的路径,可以是本地图片,也可以是网络图片,图片类型可以是png,gif,jpg”/>
- width宽度属性: <img width=”300px”/>
- height高度属性:<img height=”300px”/>
- alt图片加载失败显示的文字:<img alt=”图片加载失败的时候显示的文字”/>
- title鼠标放在图片上显示的文字:<img height=”鼠标放在图片上面显示出的文字”/>
img标签的使用
//绝对路径加载方式 <img src="C:\Users\1.gif" alt=""> //从网络上加载图片的方式显示 <img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1501781310551&di=033390815b785653300c6b68a67820b2&imgtype=0&src=http%3A%2F%2Fwww.liyuanhuadian.com%2Fimages%2F201502%2Fgoods_img%2F510_P_1424106841363.jpg" alt="" width="300px" height="200px"> //可以加载png图片 <img src="img/1.png" alt=""> //加载jpg图片 <img src="1.jpg" alt=""> //相对路径去加载jpg图片 <img src="../1.jpg" alt="">
单纯的使用img标签并不能展示出什么效果,前端所有的效果显示都是需要结合Css和js来进行显示的,标签的使用比较简单,但是效果的实现不是那么简单了
阅读全文
1 0
- 从零开始前端学习[2]:img标签的使用
- 从零开始前端学习[23]:img标签的属性和水平对齐的属性vertical-align
- 从零开始前端学习[20]:前端与后台可能需要使用交互的表单form,input标签
- img标签的使用
- 前端HTML<img>标签图像的属性和使用/图像img与背景background的区别
- 从零开始前端学习[1]:认识常用的标签
- html img标签的使用
- 菜鸡的从零开始的web笔记-img标签
- web前端之html图片操作详解从零开始(三)----img标签
- 从零开始前端学习[8]:初级选择器的使用
- 从零开始前端学习[16]:box-shadow阴影属性的使用
- 从零开始前端学习[5]:关于html5默认标签样式的介绍以及定义清除
- 从零开始前端学习[46]:在标签中添加内容,关于innerHTML和innerText的一点解析
- 前端html之img标签
- html——img标签的使用
- 图解img标签的usemap使用
- 前端开发规范(一):img标签:图片IMG标记的alt属性和title属性
- magento img 标签 使用
- Murmurhash介绍与实现
- 天天和树
- IO概要的学习
- 一个python写的XML解析器的简单实现
- 笔试题
- 从零开始前端学习[2]:img标签的使用
- 如何将matlab中的imresize()函数移植到python中
- ndk学习笔记C语言文件加解密
- MYSQL基础命令
- 真机同步到电脑桌面鼠标操作
- Java
- 两个栈实现一个队列
- 图像特征提取三大法宝:HOG特征,LBP特征,Haar特征
- 机器学习----学习笔记