代码:

<!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. django中安全sql注入等

    模拟sql注入 使用原生sql语句编写login登录逻辑 class LoginUnsafeView(View): def get(self, request): return render(requ ...

  2. Python3基础 print %xX 十六进制大小写

             Python : 3.7.3          OS : Ubuntu 18.04.2 LTS         IDE : pycharm-community-2019.1.3    ...

  3. IPv4分类

    IPv4地址按逻辑层次分为五类 A类 保留给政府机构 A类地址第1字节为网络地址,其它3个字节为主机地址.它的第1个字节的第一位固定为0. A类地址网络号范围:1.0.0.0 - 126.0.0.0 ...

  4. Maya编程——沿Curve绘制圆柱

    操作流程: 1. VS运行代码,生成插件 2. 打开Maya绘制曲线,加载插件 3. 选中绘制的曲线,运行插件 Posts1.0 代码: #include <maya/MSimple.h> ...

  5. 隐马尔科夫模型的Python3实现代码

    下面给出计算隐马尔科夫模型的编程代码: from hmmlearn.hmm import GaussianHMM import datetime import numpy as np from mat ...

  6. Efficient and Accurate Arbitrary-Shaped Text Detection with Pixel Aggregation Network(利用像素聚合网络进行高效准确的任意形状文本检测)

    PSENet V2昨日刚出,今天翻译学习一下. 场景文本检测是场景文本阅读系统的重要一步,随着卷积神经网络的快速发展,场景文字检测也取得了巨大的进步.尽管如此,仍存在两个主要挑战,它们阻碍文字检测部署 ...

  7. 【ML基础】t-SNE(t-distributed stochastic neighbor embedding)原理及推导

    前言 参考 1. t-SNE原理与推导: 完

  8. 使用极光第三方IM的时候服务器报错Caused by: java.net.UnknownHostException: api.im.jpush.cn

    Caused by: java.net.UnknownHostException: api.im.jpush.cn 服务器报这个:首先查看服务器是否能ping通,如果能ping通,则看下 vi /et ...

  9. spring boot连接mysql8.0

    今天spring boot的项目数据库从mysql5.7换到mysql8.0,遇到点问题,特此记录下来 查看mysql的版本 mysql> select version();+--------- ...

  10. Qt5.QtCreator_屏蔽警告

    ZC:注意: 修改了这个配置的话,如果有多个Qt进程的话,它不会自动同步各个进程中的值,可能是 以最后保存的为准(需要注意 ! !) 1.QtCreator屏蔽指定警告 - weixin_409542 ...