a标签内容在div中垂直居中，不兼容低版本浏览器

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>

<style>
.box{width:100px;height:200px;background:orange;border:2px solid #ccc;display: table;}
.box a{display:table-cell;vertical-align:middle;}
</style>

<body>

<div class="box"><a href="#">这是一些内容吧这是一些内容吧</a></div>

</body>
</html>

a标签内容在div中垂直居中，不兼容低版本浏览器

时间： 2024-11-03 21:13:46

a标签内容在div中垂直居中，不兼容低版本浏览器的相关文章

不定高度实现垂直居中（兼容低版本ie）

css实现垂直居中的方法比较多,但是每种方法的缺陷也很明显,我尝试对其中一种方法进行了改良 先看原方法: <div class="parent"> <div class="child"></div> </div> .parent{ width:500px; height:500px; position:relative; } .child{ width:100px; height:100px; position:abs

文字在div中垂直居中的方法，设置div的高度height和行高line-height一致

文字在div中垂直居中的方法,设置div的高度height和行高line-height一致,如 .containerdiv{ height:60px; line-height:60px; }

随机图片大小在DIV中垂直居中对齐总结

老遇到这种样式 现在总结一下 <!DOCTYPE> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <style> *{margin:0;padding:0;line-height: 1;font-size: '宋体';padding

设置span在div中垂直居中

转自:https://blog.csdn.net/weirenkuan/article/details/51177695 使用display:table-cell,span中内容无论多少,都可以垂直居中 <div style="display:table-cell;height:100px;font-size:12px;font-height:14px;vertical-align:middle;text-align:center"> <span> ceshic

未知行数的文字在div中垂直居中

今天工作中遇到一个问题,就是未知行数的文字在div中怎么垂直居中,如下面的3个图: 图1 图2 图3 图1是2行文字的效果,图2是不经过css垂直居中处理的效果,图3是经过css垂直居中后的效果,html代码如下:(经测试,除了IE7,其他浏览器都成功的垂直居中了) <div class="m"><div class="m1"><div class="m2">南京证券股份业部份业部</div><

jQ1.5中的事件系统（低版本的事件系统）

jQ的一个个版本事系统都在修正着bug和不断优化, 而且看了事件系统对事件的兼容更加熟悉, 更加了解jQ内部的事件机制. 因为jQ对事件系统引入了事件命名空间,事件的代理, 事件的手动触发,事件描述等等各种概念, 对事件的可操控性大大增加, 这个也是库存在的意义, 不是说只要处理addEventListener和attachEvent可以做到的:在大型的项目中事件系统也可以作为发布者和派发者,对整个系统进行充分的解耦, 这些做为自己的笔记,一步一步走, 只是大概看了看, 还有不懂的地方, 最好的

解决html5新标签 placeholder 低版本浏览器下不兼容问题

placeholder属性是HTML5 中为input添加的.在input上提供一个占位符,文字形式展示输入字段预期值的提示信息(hint),该字段会在输入为空时显示. 实例:1 <input type="text" name="userName" placeholder="请输入用户名"> placeholder操作起来非常方便,提高了开发效率,同时在高版本浏览器中用户体验也很好,所以本人很喜欢用这个属性. 然而,在IE9以下版本浏

CSS-布局【1】-图片在div中垂直居中

方法一:在img标签前加span <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width" /> <title></title> <style type="text/css"> div{ width: 600px; height: 600px; text-ali

小div在大div中垂直居中方式

代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>div居中</title> <style> * { margin:0; padding:0; } .content { width:400px; height:400px; background:orange; border: 1px s