<!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. python网络爬虫（9）构建基础爬虫思路

    目的意义 基础爬虫分5个模块,使用多个文件相互配合,实现一个相对完善的数据爬取方案,便于以后更完善的爬虫做准备. 这里目的是爬取200条百度百科信息,并生成一个html文件,存储爬取的站点,词条,解释 ...

  2. Jenkins安装部署及使用

    Jenkins安装部署环境如下 PS:中文官网,东西比较全.(居然有中文官网了,真好!)以下为本人自己的使用过程,仅供参考! 一.准备阶段 1.组件及版本: Jenkins版本:2.164.3 操作系 ...

  3. Redis windows服务器配置可远程连接

    Redis配置远程可访问:修改redis.conf或redis.windows-service.conf配置文件. 具体通过 1:将绑定的本机给注释掉,找到这行 bind 127.0.0.1,然后在前 ...

  4. WPF：元素绑定

    到目前为止都在讨论如何链接两个元素的绑定.但在数据驱动的应用程序中,更常见的情况是创建从不可见的对象中提取数据绑定表达式.唯一的要求是希望显示的信息必须存储在公有的属性中.WPF数据绑定基础结构不能获 ...

  5. 深入理解并使用python的模块与包

    模块 编写好的一个python文件可以有两种用途:1)脚本,一个文件就是整个程序,用来被执行2)模块,文件中存放着一堆功能,用来被导入使用 模块的分类 1)开发者编写的 .py文件2 ) 由C或C++ ...

  6. python 出现OSError: [Errno 8] Exec format error的原因

    访问 .py文件的网页的时候会出现 Exec format error的问题, 一般情况下是由于基于Unix(Linux,Mac OS)系统下的问题,办法如下 1 .chmod +x  filenam ...

  7. Hive Serde（四）

    Hive Serde 目的: ​ Hive Serde用来做序列化和反序列化,构建在数据存储和执行引擎之间,对两者实现解耦. 应用场景: ​ 1.hive主要用来存储结构化数据,如果结构化数据存储的格 ...

  8. php检测函数是否存在函数 function_exists

    php检测函数是否存在函数 function_exists 语法 bool function_exists ( string $function_name )检查的定义的函数的列表,同时内置(内部)和 ...

  9. 集合(四) Hashtable

    2.Hashtable Hashtable,顾名思义,哈希表,本来是已经被淘汰的内容,但在某一版本的Java将其实现了Map接口,因此也成为常用的集合类,但是hashtable由于和hashmap十分 ...

  10. Java 5，6，7，8，9，10，11新特性

    转自https://it18monkey.github.io java5 泛型 (Generics) List<Integer> list=new ArrayList<Integer ...