一、水平居中

.hor_center {
margin: 0 auto;
}

二、水平垂直居中

.content {
width: 360px;
height: 240px;
}
.ver_hor_center {
position: absolute;
top: 50%;
left: 50%;
margin-left: -180px; /*要居中的div的宽度的一半*/
margin-top: -120px; /*要居中的div的高度的一半*/
}

三、div置于底部(footer)

.bottom_footer {
position: fixed; /*or前面的是absolute就可以用*/
bottom: 0px;
}
 

CSS div水平垂直居中和div置于底部的更多相关文章

  1. 解读CSS布局之-水平垂直居

    对一个元素水平垂直居中,在我们的工作中是会经常遇到的,也是CSS布局中很重要的一部分,本文就来讲讲CSS水平垂直居中的一些方法.由于我们大搜车的日常工作中已经不再需要理会低版本IE,所以本文所贴出的方 ...

  2. CSS 布局 - 水平 & 垂直对齐

    CSS 布局 - 水平 & 垂直对齐 一.元素居中对齐 要水平居中对齐一个元素(如 <div>), 可以使用 margin: auto;. 设置到元素的宽度将防止它溢出到容器的边缘 ...

  3. CSS:CSS 布局 - 水平 & 垂直对齐

    ylbtech-CSS:CSS 布局 - 水平 & 垂直对齐 1.返回顶部 1. CSS 布局 - 水平 & 垂直对齐 水平 & 垂直居中对齐 元素居中对齐 要水平居中对齐一个 ...

  4. CSS实现水平垂直同时居中的5种思路

    × 目录 [1]水平对齐+行高 [2]水平+垂直对齐 [3]margin+垂直对齐[4]absolute[5]flex 前面的话 水平居中和垂直居中已经单独介绍过,本文将介绍水平垂直同时居中的5种思路 ...

  5. CSS实现水平垂直同时居中的6种思路

    前面的话 水平居中和垂直居中已经单独介绍过,本文将介绍水平垂直同时居中的6种思路 水平对齐+行高 [思路一]text-align + line-height实现单行文本水平垂直居中 <style ...

  6. HTML/CSS:div居中和div内部元素垂直居中(1)

    div居中 div水平和垂直居中,text-align和vertical-align不起作用,因为标签div没有这两个属性,所以再css中设置这两个值不能居中的效果 1. div水平居中:设置marg ...

  7. img外头包着a时底部出现的一小段高度的解决方法。图片水平垂直居中用css解决的方法。

    <a><img/></a> 这种结构有时候在界面预览的时候会出现一段多出来的高度.这个高度,一开始我很奇怪是什么原因产生的.鼠标移动到a标签上会有高度出现,一开始我 ...

  8. margin:-75px的理解及妙用——纯CSS制作水平/垂直都居中短边为50px/长边为150px的红色十字架

    有这么一个题目: 使用重构的方式制作出一个如下图的水平.垂直都居中短边为50px,长边为150px的红色十字架. 要求只使用2个div完成 答案: <!DOCTYPE html PUBLIC & ...

  9. CSS文字垂直居中和font-family属性

    1.单行文字的垂直居中 单行文字垂直居中比较简单,直接让行高==盒子高度即可. 2.多行文字居中 多行文字居中,只需简单计算一下盒子的上padding即可.计算公式:padding-top=(盒子的高 ...

随机推荐

  1. iOS检查App新版本并更新新版本

    检查新版本 更新  第一种方法 //检查新版本 更新 dispatch_async(dispatch_get_global_queue(DISPATCH_QUEUE_PRIORITY_DEFAULT, ...

  2. 解决idea中执行maven命令失败的问题

    1.问题描述 如上图所示,在使用idea 里的maven命令执行项目打包时,有时候会报如下一个错误. -Dmaven.multiModuleProjectDirectory system proper ...

  3. C# .net dotnet属性定义属性,以提供显示明称,默认值

    //使用显示名称初始化 System.ComponentModel.DisplayNameAttribute 类的新实例. displayName 显示名称 [DisplayName("we ...

  4. #研发解决方案#discache-分布式缓存查询与管理系统

    郑昀 基于马海元和闫小波的文档 关键词:memcached.redis.分布式缓存.控制台.反序列化.Java 本文档适用人员:研发和运维员工 提纲: 如何查看缓存里的序列化数据? 批量删除来一个 监 ...

  5. jquery打造自定义控件(原创)

    本人第一次发表文章,不足之出请大家多多包涵 下面是一个combox的代码 /// <reference path="../Js/jquery-1.7.2.min.js" /& ...

  6. sizeof

    一.sizeof使用的场合: 1.sizeof操作符的一个主要用途是与存储分配和I/O系统那样的例程进行通信.例如: void* malloc(size_t size); size_t fread(v ...

  7. Linux终端打印命令使用介绍

    常用linux打印命令 日常使用中或shell脚本中linux终端打印命令有echo和printf.  echo命令 功能说明:显示文字.语 法:echo [-ne][字符串]或 echo [--he ...

  8. 实验楼 linux 学习

    实验楼 linux 学习     一.Linux 用户管理 1.查看用户 who am i // who mom likes whoami   ====--------====== 输入的第一列表示打 ...

  9. 解决Docker容器时区及时间不同步问题

    今天在系统集成测试时由测试人员提交了一个测试bug,原因是提交业务数据时间与实际时间(北京时间)有偏差,导致统计异常.由于我们集成测试是向测试人员直接提供完整的Docker镜像作为测试环境,原因应该是 ...

  10. Linux 之 目录和文件

    1  初识 1.1  终端 打开终端: Ctrl + Alt + F1 ~ F6 图形界面: Ctrl + Alt + F7 1.2  命令 1)  一般 date; cal - calendar; ...