css 标签 垂直居中
<!DOCTYPE html >
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> 多行文字实现垂直居中 </title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
div#wrap {
display:table;
border:1px solid #FF0099;
background-color:#FFCCFF;
width:380px;
height:200px;
_position:relative;
overflow:hidden; }
div#subwrap {
vertical-align:middle;
display:table-cell;
_position:absolute;
_top:50%;
}
div#content {
_position:relative;
_top:-50%;
}
.p{
width:200px;
height:200px;
background-color:lightblue;
display: table;
}
.c{
display: table-cell;
width:50px;
height:50px;
background-color:lightgreen;
}
</style>
</head>
<body>
<div id="wrap">
<div id="subwrap">
<div id="content">
<div style="width:100px;height:100px;background-color:black;margin:0 auto;"></div>
</div>
</div>
</div>
</body>
</html>
css 标签 垂直居中的更多相关文章
- 五种方法让CSS实现垂直居中
利用 CSS 来实现对象的垂直居中有许多不同的方法,比较难的是选择那个正确的方法.我下面说明一下我看到的好的方法和怎么来创建一个好的居中网站. 使用 CSS 实现垂直居中并不容易.有些方法在一些浏览器 ...
- CSS实现垂直居中的5种方法
利用 CSS 来实现对象的垂直居中有许多不同的方法,比较难的是选择那个正确的方法.我下面说明一下我看到的好的方法和怎么来创建一个好的居中网站. 使用 CSS 实现垂直居中并不容易.有些方法在一些浏览器 ...
- 转: css实现垂直居中的方法
利用 CSS 来实现对象的垂直居中有许多不同的方法,比较难的是选择那个正确的方法.我下面说明一下我看到的好的方法和怎么来创建一个好的居中网站. 用 CSS 实现垂直居中并不容易.有些方法在一些浏览器中 ...
- 顽石系列：CSS实现垂直居中的五种方法
顽石系列:CSS实现垂直居中的五种方法 在开发过程中,我们可能沿用或者试探性地去使用某种方法实现元素居中,但是对各种居中方法的以及使用场景很不清晰.参考的内容链接大概如下: 行内元素:https:// ...
- css 文字垂直居中问题
CSS 文字垂直居中问题 问题:在 div 中文字居中问题: 当使用 line-height:100%%; 时,文字没有居中,如下: html: <div id="header_log ...
- css标签及属性
css标签及属性 HTML引入CSS的方法 1.嵌入式 <style type = “text/css”>要写的样式</style> 2.外联式 <link rel ...
- CSS水平垂直居中总结
行内元素水平居中 把行内元素包裹在块级父元素中,且父元素中的css设置text-align:center; <!DOCTYPE html> <html> <head> ...
- css图片垂直居中
css图片垂直居中一.style代码 .case-pic{ height: 125px; position: relative; text-align: center } .case-pic span ...
- CSS标签居中
CSS标签居中是相对于父标签说的,即在父标签的中居中.通常是在子标签中使用margin:0 auto,来使子标签居中.此外子标签需要有固定的宽度才行,比如 子标签为div时,div的宽度默认占父标签的 ...
随机推荐
- Delphi Dll示例
//MyInt.pas unit MyInt; interface {$IFNDEF MYLIB} function MyAdd(a,b:integer):integer ;stdcall; {$EN ...
- JQuery源码之“对象的结构解析”
吃完午饭,觉得有点发困,想起了以后我们的产品可能要做到各种浏览器的兼容于是乎不得不清醒起来!我们的web项目多数是依赖于Jquery的.据了解,在Jquery的2.0版本以后对IE的低端版本浏览器不再 ...
- 1066 Bash游戏
1066 Bash游戏 基准时间限制:1 秒 空间限制:131072 KB 有一堆石子共有N个.A B两个人轮流拿,A先拿.每次最少拿1颗,最多拿K颗,拿到最后1颗石子的人获胜.假设A B都非常聪明, ...
- detailsview 样式小问题
detailsview不显示表头,设置HeaderText=""就可以,不知道为什么,如果有值,其他方式都没有调好! 内网格显示为0,Gridlines="None&qu ...
- JavaScript学习基础部分
JavaScript学习基础 一.简介 1.JavaScript 是因特网上最流行的脚本语言,并且可在所有主要的浏览器中运行,比方说 Internet Explorer. Mozilla.Firefo ...
- linux power button
最近需要使用到power button按键,linux中有gpio keys的机制,只要注册即可. device注册 arch/arm/mach-mx6/board-mx6q_sabresd.c #d ...
- 常用公共的css的样式
html{-webkit-text-size-adjust:none; /*解决chrome浏览器下字体不能小于12px*/} body{overflow-x: hidden; font-size:1 ...
- PHP 数组和字符串互相转换实现方法
$array=explode(separator,$string); $string=implode(glue,$array);
- Unity插件研究院之ResourceChecker
这个插件是我在国外网站逛论坛发现的,试用了一下非常好用,是一个轻量级的插件就一个类.开发中尤其是和美术合作的时候,可能你会发现Project视图中有很多没有用到的资源,但是你又不敢删除,因为你不知道那 ...
- python_字典
1. 字典的定义 字典由多个键及其对应的值构成(我们也把键/值对称为项).键是唯一的,值不唯一.键可以是数字.字符串甚至是元组. 2. 字典的创建 (1) phonebook = {"} 名 ...