设置了width和height的a元素在IE11与IE11以下浏览器中的不同渲染方式

#welcomeMiddleBtn {
    display: block;
    width: 73px;
    height: 120px;
    margin: 0px auto;
}

<a id="welcomeMiddleBtn" href="${basePath}/files/test.zip"> 　　<img src="${basePath}/images/welcome/transparent.png" border="0"></img><!--为了兼容IE11以下的版本，这里用个透明图片撑一下a元素 --></a>

在上面的CSS样式中，我们给a元素设置成了块元素，并且设置了width和height；

在火狐，谷歌浏览器以及IE11浏览器中这个a元素都可以正常的渲染为一个有width和height块级元素

但是在IE11以下的版本，就会有问题，IE在渲染它时，由于a元素中未包含内容，就算CSS已经设置了width和height，IE依然不会把它渲染出来，这就导致没法点击到该

解决方案：就是在a中包含内容，把它撑出来

时间： 2024-10-08 17:59:09

设置了width和height的a元素在IE11与IE11以下浏览器中的不同渲染方式的相关文章

position之absolute中left、bottom、top、right与width、height的关系

1.在网页设计中我们经常遇到宽度自适应,但有时候可能一种高度自适应的问题.这个时候我们的position之absolute就可以帮你了. 2.position之absolute是脱离文档流.当width.height设置某值后,该元素的值就是该值.那width.height没有设置的时候呢? 3.该元素的witdh.height会根据父元素(需设置position:relative,没有则按浏览器作为父元素)的width.height和该元素left.bottom.top.right而改变. 公

Canvas设置width与height 的问题！

最近因为工作需要,所以就学了一下Html中的Canvas标签. 当我看了一下教程后,自己写了一个hello world的时候,麻烦事就出现了.看下面代码: <!DOCTYPE html> <html lang="en"> <body> <canvas id="canvas1" style="width: 200px;height: 200px; border:1px solid black;"> &

使用 <embed> 标签显示 flash文件(swf)格式 ,如何设置 width 和 height 宽度,高度.

1. embed 标签支持 .swf 格式. .flv 的不支持. 2. 通常情况下, 网站中上传多个 flash文件. 它的默认大小是不一样的. 而且可以宽度大于高度(横向的) ; 宽度小于高度 (竖向的) . 此时. 最好的的办法是给 <embed> 设置一个固定的宽度和高度 . 此时flash 会自动缩放. 至于缩放比例: 如果先碰到高度 , 那么 flash的高度就是 embed的设置的高度, 宽度等比例缩放; 如果先碰到宽度, 那

H5 canvas的 width、height 与style中宽高的区别

Canvas 的width height属性 1.当使用width height属性时,显示正常不会被拉伸:如下 <canvas id="mycanvas" width="300" height="300">浏览器不支持Canvas,请升级或改用其它浏览器!</canvas> <script type="text/javascript"> var canvas = document.getE

剖析width、height继承

在CSS这个一切皆为框的世界里,我们今天再来探究探究width与height. 我靠,width与height有什么好探究的,不就是设定元素的宽.高吗?大不了还要区分标准盒子模型和IE盒子模型的区别,申明文档类型,统一盒子模型,不就over啦.哈哈,的确也是这样的,不过width.height还有一特性哦,那就是继承,子元素通过设置百分比可以继承父元素的宽高. 因为盒子模型有两种,所以呢,下面我们就来分别看一看,width和height在这两种盒子模型中,到底是怎么继承父元素的. *为了方便大家

width 、 height 与 box-sizing : border-box ,content-box 的关系

默认 width .height的 content-box 的宽高. box-sizing 经常用来设置 width.height指定的区域 box-sizing 经常用做一些自适应的布局. 语法: box-sizing:content-box | border-box 默认值:content-box 适用于:所有接受 <' width '> 和 <' height '> 的元素继承性:无动画性:否计算值:指定值取值: content-box: padding和border

jQuery 的 width()、height()、innerWidth()、innerHeight()、outWidth()、outHeight() 的区别

jQuery width() 和 height() 方法 width() 方法设置或返回元素的宽度(不包括内边距.边框或外边距). height() 方法设置或返回元素的高度(不包括内边距.边框或外边距). <!DOCTYPE html> <html> <head> <script src="/jquery/jquery-1.11.1.min.js"> </script> <script> $(document).

width() 、 height() 方法；innerWidth() 、innerHeight() 方法；outerWidth() 、 outerHeight() 方法的区别

1.width() . height() 方法设置或返回元素的宽度.高度(不包括内边距.边框或外边距): 2.innerWidth() .innerHeight() 方法返回元素的宽度.高度(包括内边距): 3.outerWidth() . outerHeight() 方法返回元素的宽度.高度(包括内边距和边框): 原文地址:https://www.cnblogs.com/hwldyz/p/9335850.html

web前端入门到实战：CSS属性width和height

width 是定义元素内容区的宽度:height是定义元素在内容区的高度. 在内容区外面可以增加内边距(padding).边框(border)和外边距(margin),这样的话就成了我们常说的盒子模型,后期内容中会给大家讲到这些, 在行内非替换元素会忽略width这个属性,也就是我们不定义这个元素的时候,默认值为auto,由内容将其撑开. 绝对单位 1. 像素px(pixels),在web上,像素px是典型的度量单位,这也是我们最常用的单位.像其他一些单位最终,都会被按照像素处理2. 英寸in(