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 ...
随机推荐
- MobileWeb 适配总结
开门见山,本篇将总结一下 MobileWeb 的适配方法,即我们常说的H5页面.手机页面.WAP页.webview页面等等. 本篇讨论的页面指专门针对手机设备设计的页面,并非兼容全设备的响应式布局. ...
- COGS 有标号的二分图计数系列
其实这三道题都是不错的……(虽然感觉第三题略套路了……) 分别写一下做法好了…… COGS2392 有标号的二分图计数 I 这个就很简单了,Noip难度. 显然可以直接认为黑点和白点分别位于二分图两侧 ...
- ArcGIS DataStore手册——管理篇
第二章:ArcGIS DataStore管理维护 1.备份管理 备份的目的在于发生原始数据损坏或其他突发情况时,可避免数据丢失,并可快速的使用备份数据来恢复,以保证服务仍可使用. 单机模式下,可使用D ...
- VS2010环境开发Teamcenter ITK
前言 这篇文章主要是用Teamcenter ITK开发的入门配置教程.几个月前学习ITK开发时,领导要求将配置过程整理成学习笔记.最近同事要做ITK开发,就发给他了.感觉这篇文章对别人还是有帮助的,决 ...
- Android Button事件处理
一般只需要处理按钮的点击事件就可以,但想让一个按钮处理多个事件,就得同时监听多个方法. OnClickListener 点击事件 OnLongClickListener 长按事件 OnTouchLi ...
- qt MessageBOX 消息
void MessageBox::slotQuestion() { switch(QMessageBox::question(this,"Question",tr("It ...
- SVN 代码托管
1.安装服务 使用yum安装subversion,简单.不繁琐. 1 yum install -y subversion 2.创建版本库 1 2 mkidr /svn/obj ...
- CSS中DIV只出现竖向滚动条且内容自动换行
只需要设置如下的样式即可: <div id="testDiv" style="overflow-x: hidden; word-break:break-all;bo ...
- devexpress 中 XtraTabcontrol 改变BackColor 的方法
装载自CSDN,原文地址 https://blog.csdn.net/zjzytnn/article/details/53699340 今天在实现CAD文件的读和显示操作的时候,需要将CAD文件显示 ...
- 如何避免在EF自动生成的model中的DataAnnotation被覆盖掉
摘自ASP.NET MVC 5 网站开发之美 6.4 Metadata与数据验证 如果使用Database-First方式生成*.edms,那么所生成的类文件会在*.tt文件的层级之下,扩展名tt是一 ...