<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="zh-cn">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<title>居中div演示效果</title>

<style type="text/css">

.align-center{

margin: auto; /* 居中 这个是必须的，，其它的属性非必须 */

width:500px; /* 给个宽度 顶到浏览器的两边就看不出居中效果了 */

background:red; /* 背景色 */

text-align:center; /* 文字等内容居中 */

}

</style>

</head>

<body>

<div class="align-center">居中div演示效果</div>

</body>

</html>

Div内容居中的更多相关文章

  1. div居中与div内容居中,不一样

    1.div自身居中 使用margin:0 auto上下为0,左右自适应的css样式. 要让div水平居中,那么除了设置css margin:0 auto外,还不能再设置float,不然将会导致div靠 ...

  2. HTML CSS 中DIV内容居中汇总

    转载博客(http://www.cnblogs.com/dearxinli/p/3865099.html) (备注:DIV居中情况,网上谈到也比较多,但是这篇文字,相对还是挺全面,现转载,如果冒犯,还 ...

  3. 【转】css布局居中和CSS内容居中区别和对应DIV CSS代码

    原文地址:http://www.divcss5.com/jiqiao/j771.shtml css布局居中和CSS内容居中区别和对应DIV CSS代码教程与图文代码案例篇 对于新手来说DIV CSS布 ...

  4. div内容上下居中

    今天无聊闲逛技术群,听一哥们说要在div里面居中span内容. 第一印象:vertical-align: middle; 结果失效.因为他只对属于inline的元素或是inline-block.tab ...

  5. div中的内容居中

    要使div中的内容居中显示,不仅div要设定“text-align:centr"  ,内置对象要添加margin:auto;属性才能使其在firefox等其他浏览器中也能居中.

  6. div宽高不确定，内容居中

    当div的宽高不确定时候,内容居中:// 加在父级div中 垂直居中:align-items:center; display: -webkit-flex;水平居中:justify-content:ce ...

  7. css3实现左右div高度自适应且内容居中对齐

    主要运用了css3的弹层布局,直接上代码: 效果:左边盒子宽度固定.内容居中对齐.与右侧盒子高度相等,右侧自动缩放 html: <div class="main"> & ...

  8. 使用 margin 让div块内容居中

    问:有一个div块,其width为300px,如何设置margin让div块居中显示? 答:margin设置为 margin:0 auto,即div块的上下外边距设置为 0 , 左右外边距设置为 自动 ...

  9. 各种div+css居中方式调整（转载）

    盘点8种CSS实现垂直居中水平居中的绝对定位居中技术 分类: 前端开发2013-09-11 21:06 24959人阅读 评论(3) 收藏 举报 绝对居中垂直居中水平居中CSS居中代码   目录(?) ...

随机推荐

  1. Codeforces 1203F2. Complete the Projects (hard version)

    传送门 首先对于 $b>0$ 的工作显然有个贪心,把 $b>0$ 的按 $a$ 从小到大排序 把能做的都做了,然后得到一个最大等级 剩下就是考虑 $b<0$ 的工作了,看到数据显然可 ...

  2. CSP前模板复习

    Tarjan 求强连通分量 展开查看 #include #include #include using namespace std; const int N = 1e4 + 1e3; int n, m ...

  3. try catch和finally

    在C#中这三个关键字用于处理异常. 这三个关键字try是必定要用的,要不然就失去了意义.然后catch和finally可以不用但是要注意遵循原则. 存在一个或多个catch的时可以不用finally, ...

  4. mysql复习(2)

    一.数据定义: SQL数据的定义包括模式的定义.表定义.视图定义和索引的定义. 1.基本的模式定义情况如下表. 2.一个关系数据库管理系统的实例中可以创建多个数据库,一个数据库中可以建立多个模式,一个 ...

  5. linux命令详解——lsof

    lsof全名list opened files,也就是列举系统中已经被打开的文件.我们都知道,linux环境中,任何事物都是文件, 设备是文件,目录是文件,甚至sockets也是文件.所以,用好lso ...

  6. ansible常用模块详解（三）

    1.模块介绍 明确一点:模块的执行就类似是linux命令的一条命令,就单单的是为了执行一条语句,不是批量的操作,批量操作需要用到playbook内类似shell编写脚本进行批量. 1.1 模块的使用方 ...

  7. docker常用命令与容器创建

    ################docker安装##################### Docker从1.13版本之后采用时间线的方式作为版本号,分为社区版CE和企业版EE. 社区版是免费提供给个 ...

  8. 简单了解TCP/IP与HTTP

    这种东西网上资源非常丰富,完全没有必要造轮子,更何况 这也不是你能造的啊,来 上连接 TCP/IP https://www.runoob.com/tcpip/tcpip-intro.html HTTP ...

  9. 搭建CentOs7的WebServer

    CentOs7,在安装的时候,自己可以定义一些东西,包括硬盘分区,服务器角色等. 这一些就搭了一个BasicWebServer,这样的话,里面的很多勾选,包括Java,Perl,Python,php等 ...

  10. java8 lambda表达式应用

    1.用lambda表达式实现Runnable非常简单// Java 8之前: new Thread(new Runnable() { @Override public void run() { Sys ...