HTML中IMG标签总结
一、Img标签有两个重要的属性:
1.src 属性:图片的地址
2.alt 属性:图片不显示是现实的文字
二、Img标签是行级元素:
img、input属于行内替换元素。height/width/padding/margin均可用。效果等于块元素。行内非替换元素,例如, height/width/padding top、bottom/margin top/bottom均无效果.只
能用padding left/right和margin left/right改变宽度。
三、Img标签进行居中:
1.第一种方式:这种方式我不是很喜欢,Img标签有事不能设置为table-cell。容易产生错误。
img_div{
display: table-cell;vertical-align: middle; /*控制图片垂直居中*/
text-align: center; /*控制图片水平居中*/
}
2.第二种方式:这种方式Img标签最好不要带有margin属性,否则不会居中。
img{
position: absolute;top:50%;left: 50%;
transform:translate(-50%,-50%);
}
四、Img标签事件:
1.使用HTML DOM Event 对象的 onerror事件可以对显示异常的图片进行处理。
<img src="img/1.jpg" alt="这是一张图片" onerror="alert(this.alt)">
HTML中IMG标签总结的更多相关文章
- Html中<font>标签的使用
Html中<font>标签的使用 <!doctype html> <html lang="en"> <head> <meta ...
- jsp2.0+中的标签文件,JSP Fragment技术
刚进新公司不久,今天在看到项目中用到了.tag文件.刚开始我还以为这个是第三方类似freemarker的模板技术.问了下项目组的其他人员,原来这是jsp2.0以来就有的JSP Fragment技术.以 ...
- Html中<a>标签的样式的设置
html中<a>标签的样式的设置.. ------------------------ <html> <head> <title>这是网页选项卡的名称& ...
- 禁止手机页面中A标签长按弹出路径框
//禁止手机页面中A标签长按弹出路径框 window.onload=function(){ document.documentElement.style.webkitTouchCa ...
- JSP中<img>标签引用本地图片
问题描述: jsp页面中<img>标签如何读取本地文件夹中的图片. 问题起因: 由于上传图片至本地文件夹中,图片路径为: D:/upload/file/image/img.jpg 所以将这 ...
- HTML中<meta>标签如何正确使用
HTML中<meta>标签如何正确使用 如果我们在浏览器中按下F12或者Ctrl+shift+J,便可以打开开发者工具,在element中即可看到<head>元素中有不少< ...
- Jquery获取iframe子/父窗口中的标签
获取子窗口中的标签: $("#id",document.frames('iframename').document); 获取父窗口中的标签: $('#id', parent.doc ...
- 在php中,如何将一个页面中的标签,替换为用户想输出的内容
前言:釜山行,暴露人性, ———————————————————————————————————————————————————————————————————————————— 今天说一个最简单的例 ...
- JSP内置标签 JSP中JavaBean标签 JSP开发模式 EL和JSTL快速入门
2 JSP内置标签(美化+业务逻辑) 1)为了取代<%%>脚本形式,使用JSP标签/JSP动作,目的:与JSP页面的美化,即JSP面页都是由标签组成,不再有其它的内容 2)JSP内 ...
- Smarty中一些标签的使用
Smarty中的标签和php中的标签不一样 foreach标签{foreach from=$goods(变量名) key='键,不带$' item='值,不带$'}中间的显示内容{/foreach ...
随机推荐
- ES6之class 中 constructor 方法 和 super 的作用
首先,ES6 的 class 属于一种“语法糖”,所以只是写法更加优雅,更加像面对对象的编程,其思想和 ES5 是一致的. function Point(x, y) { this.x = x; thi ...
- 2D平面中关于矩阵(Matrix)跟图形变换的讲解
在二维平面上,常用的有以下三种基本的图形变化: 1)Translation 2)Scale 3)Rotation 在canvas的开发中,我们也经常会用到这样的一些图形变换,尤其是我们在写自定义Vie ...
- <Android Framework 之路>BootAnimation(1)
介绍 开机动画,BootAnimation,就是Android手机开机郭晨各种以一个展示给用户的界面,实际是一个多个帧组成的动画,在界面上进行一帧一帧的播放,形成开机动画的效果. 本文针对Androi ...
- Creator4.2建模心得与技巧1——树的建立与跟随摄像机旋转
Creator建模: 树一般在虚拟现实程序中都用面来实现,一种方法是通过两个面相互垂直成90度叠放在一起,另一种方法是让树面正对着视角一起旋转.这里主要说一下第二种方法. 主要思路:把树面一直正对着摄 ...
- 通过JTS源码分析Rtree(未完待续)
前言 R树在数据库等领域做出的功绩是非常显著的.它很好的解决了在高维空间搜索等问题.它把B树的思想很好的扩展到了多维空间,采用了B树分割空间的思想,并在添加.删除操作时采用合并.分解结点的方法,保证树 ...
- .NET开源工作流RoadFlow-流程运行-任务收回
如果一个任务则发送,又觉得还要想修改可以立即收回刚刚发送的任务. 任务收回条件:任务发送后下一步处理人还没有打开该任务,则在已办事项中会看到 收回 按钮,否则不能收回. 点击收回按钮再确认即可收回刚刚 ...
- restful课程凌杂知识点
request.post:字典形式数据 request.body:收到的是源数据
- Java基础之Java中的泛型
1.为什么要使用泛型 这里我们俩看一段代码; List list = new ArrayList(); list.add("CSDN_SEU_Cavin"); list.add(1 ...
- vs2013 c# 中调用 c 编写的dll出错的可能错误
先说出错原因: 堆栈调用顺序 解决办法: 使用 __stdcall 或 使用C#属性 CallingConvention 起因是我想在c#中调用c函数结果出错了 如下 C 头文件 ...
- [问题记录]libpomelo的安装
1. 描述: 按照github上的操作完成 Windows in your libpomelo project root directory open git bash and type in mkd ...