代码:

<!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 solid green;

            position:relative;

            margin: 100px auto;

          }

          .nav {

            width:80px;

            height:80px;

            line-height:80px;

            text-align:center;

            background:green;

            margin: auto;

            position:absolute;

            left: 0;

            top: 0;

            bottom:0;

            right: 0;

          }

  </style>

</head>

<body>

  <div class="content">

         <div class="nav">这是内容</div>

    </div>

</body>

</html>

　　效果：

小div在大div中垂直居中方式的更多相关文章

  1. Day_09【常用API】扩展案例2_测试小字符串在大字符串中出现的次数

    分析以下需求,并用代码实现 1.键盘录入一个大字符串,再录入一个小字符串 2.统计小字符串在大字符串中出现的次数 3.代码运行打印格式: 请输入大字符串: woaiheima,heimabutongy ...

  2. 小div在大div中垂直居中，以及div在页面垂直居中

    <html> <head> <title>淘宝 2faner</title> <style type="text/css"&g ...

  3. 小 div在大 div中左右上下居中

    <!DOCTYPE HTML><html><head> <meta http-equiv="Content-Type" content=& ...

  4. 小div在大div里面水平垂直都居中的实现方法

    关于如何设置小盒子在大盒子里面水平垂直方向同时居中的实现方法有很多种,下面仅列举了常用的几种. 首先看一下要实现的效果图及对应的html代码: <div class="parent&q ...

  5. 小div在大div里面 垂直居中

    方法1: .parent { width:800px; height:500px; border:2px solid #000; position:relative; } .child { width ...

  6. span(行级元素)在不定高的div(块级元素)中垂直居中的方法

    设置父级元素: align-items: center; display: flex;

  7. java 11-8 在大串中查找小串的案例

    1.统计大串中小串出现的次数 举例: 在字符串"woaijavawozhenaijavawozhendeaijavawozhendehenaijavaxinbuxinwoaijavagun& ...

  8. html中div使用CSS实现水平/垂直居中的多种方式

    CSS中的居中,在工作中,会经常遇到.它可以分为水平居中和垂直居中,以下是几种实现居中的方式. git 查看源码 配合在线预览,效果更佳 以下例子中,涉及到的CSS属性值. .parent-frame ...

  9. div+css 怎么让一个小div在另一个大div里面 垂直居中

    div+css 怎么让一个小div在另一个大div里面 垂直居中 方法1: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 .parent {           width:800 ...

随机推荐

  1. windows下postgresql数据库备份和还原

    1.通过cmd进入数据库的bin目录 cd C:\Program Files\PostgreSQL\9.6\bin 2.执行pg_dump备份命令,localhost 或者IP pg_dump -h ...

  2. mark_Linux_wc

    Linux wc命令 Linux wc命令用于计算字数. 利用wc指令我们可以计算文件的Byte数.字数.或是列数,若不指定文件名称.或是所给予的文件名为"-",则wc指令会从标准 ...

  3. java多线程（六）线程控制类

    1.   多线程控制类 为了保证多线程的三个特性,Java引入了很多线程控制机制,下面介绍其中常用的几种: l  ThreadLocal l  原子类 l  Lock类 l  Volatile关键字 ...

  4. 分布式事务二TCC

    分布式事务解决方案之TCC 4.1.什么是TCC事务 TCC是Try.Confirm.Cancel三个词语的缩写,TCC要求每个分支事务实现三个操作:预处理Try.确认Confirm.撤销Cancel ...

  5. LeetCode 101. Symmetric Tree（镜像树）

    Given a binary tree, check whether it is a mirror of itself (ie, symmetric around its center). For e ...

  6. Session覆盖测试(要验证码提交到后续页面操作的 绕过去的场景)

    测试原理和方法 找回密码逻辑漏洞测试中也会遇到参数不可控的情况,比如要修改的用户名或者绑定 的手机号无法在提交参数时修改,服务端通过读取当前session会话来判断要修改密码的账 号,这种情况下能否对 ...

  7. LeetCode_455. Assign Cookies

    455. Assign Cookies Easy Assume you are an awesome parent and want to give your children some cookie ...

  8. Delphi根据不同分隔符获取字符串内容

    function GetFieldValue(separator:Char;strLine: string; nNum: Integer): string; var Strs :TStrings; R ...

  9. shiro中anon配置不生效

    再配置shiro的时候,如下代码要注意: 1.下述代码中必须是LinkedHashMap 而不能是HashMap. 2.anon定义必须在authc之前 否则anon定义不生效   @Bean     ...

  10. ASP.Net validator

    <asp:TextBox ID="txtTransitDays" runat="server"></asp:TextBox> <a ...