html div中元素垂直居中,HTML/CSS:div水平与元素垂直居中(2)_weixin_39603823的博客-程序员宅基地

技术标签: html div中元素垂直居中  

单个div水平居中:设置margin的左右边距为自动

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

代码:

HTML

CSS

#parent {

margin: 0 auto;

}

多个div水平居中:设置display的属性为inline-block

多个div水平居中,text-align和vertical-align不起作用,因为标签div块没有这两个属性,所以需要先使用display进行块级的调整

ff85f3e1cc3eff34f70480bc678e0eec.png

代码:

HTML

在此处添加对图像的描述

在此处添加对图像的描述

<
版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/weixin_39603823/article/details/117890145

智能推荐

canvas生成图片分享并保存相册【uniapp开发小程序项目】-程序员宅基地

canvas生成图片分享并保存相册具体步骤描述:添加画布首先,在小程序里进行绘图操作需要用到组件,那我们就先在我们的wxml代码中放入<canvas>,然后,我们要开始写JS代码在这张画布上进行绘图操作。代码如下:html代码:<template> <view class="mine"> <!-- //广告 触发分享打开分享弹窗,开始...

Java编程语言基础 课后作业-程序员宅基地

第一章初识Java1.写出Java领域的相关技术在计算机软件应用领域中,一种是安装和运行在本机上桌面程序,另一种是通过浏览器访问的面向lnternet的应用程序。2.简述Java程序中注释的作用及类型在java中常用的注释有两种:单行注释和多行注释 单行注释使用"//"开头,多行注释以"/*"开头"*/"结尾。3.写出在MyEclipse中开发一个java程序步骤。创造一个JAVA项目,创建并编写...

并发用户数、QPS等概念_40qps-程序员宅基地

并发用户数和QPS参考:https://blog.csdn.net/wisters/article/details/7222476关于并发用户数和QPS,自己一直被这两个概念纠结,阅读了一下相关资料,总结如下:并发 用户数和QPS两个概念没有直接关系,但是如果要说QPS时,一定需要指明是多少并发用户数下的QPS,否则豪无意义,因为单用户数的40QPS和20并 发用户数下的40QPS是两个不同的概念。前者说明该应用可以在一秒内串行执行40个请求,而后者说明在并发20个请求的情况下,一秒内该应用能处理4_40qps

FreeBSD软件安装卸载工具--Ports和Packages详解-程序员宅基地

1如何只下载 tarball? 如果只希望下载 tarball 下来的话,仅需下 make fetch 即可。预设会将 joe 的 tarball 下载至 /usr/ports/distfiles/ 目录下。如果是希望下载安装此 ports 所有须要的其他 ports 的tarball,以 make fetch-recursive如果是希望下载全部所有 ports 的 tarball ,则:cd

7.12 web安全基础学习笔记_web安全学习笔记_十九不瞌睡的博客-程序员宅基地

1.URL是什么统一资源定位符(Uniform Resource Locator,常缩写为URL),有时也被俗称为网页地址(网址)。它的作用就是用于定位服务器的资源。这个资源可以是HTML页面,CSS文档,图像等等.2.URL的标准格式协议类型+服务器域名/IP地址+服务器端口号+资源所在路径+发送给服务器的数据+锚点3.URL编码为了解决承担特殊作用的字符冲突问题:URL编码方案会对这些有问题的字符进行编码,使其可通过HTTP安全传输。URL编码的字符都以%为前缀,其后是这个字_web安全学习笔记

Python字典在实际工作中的应用-程序员宅基地

应用背景 在工作中遇到要为现有的数据库表A添加大量数据,该数据与A表中某类数据相同,但是ID不同,并且同时增加关联该表的其他表格(B、C表)。解决方法 解决思路: 通过Python字典类型变量,转换关联表中原数据的ID为对应新增数据的ID。 首先,根据条件找出A表中要添加的数据,可以下载这些数据到本地(xml文件或cvs文

随便推点

Eclipse离线安装Veloeclipse插件-程序员宅基地

原本在线安装的地址是: http://veloeclipse.googlecode.com/svn/trunk/update/ 但因为google的相关网站在国内被墙了,所以一般情况下访问不了。 现提供离线安装方式: 到百度云下载Veloeclipse离线安装包:veloeclipse.zip 再通过Eclipse里的“Install New Soft...

maxon电机中文名_MAXON电机完全手册(全系列).pdf_想年先生的博客-程序员宅基地

www.PLC www.PLCwww.91HMI.com www.PLCPDF 文件使用 "pdfFactory Pro" 试用版本创建 www.91HMI.comwww...._maxon电机选型手册

php心路历程,一道php代码审计题目的心路历程_陆家贤的博客-程序员宅基地

前言前端时间做了一道CTF-php代码审计的题目,此题目说难也不算难,属于中等偏上一点点的题目。我在三个小时内做出来了,但是我忽然回顾我做这种代码审计题目的时候,发现这四年的比赛生涯,代码审计题目永远都是我的弱项,而且成长极慢。总是在一头雾水中开始,一头雾水中结束。所以我想梳理一下这道题目我是怎么做出来的,并解决以下问题:1、遇到代码审计的题目从哪里入手才是正确的2、做到哪里是难点,坚持不下去了,..._php审计题目

oracle电子邮件确认进不去,在Oracle中解析电子邮件地址以计算在@ sign之前包含3个或更少字符的地址数(Parse email address in Oracle to count num..._琪包的博客-程序员宅基地

在Oracle中解析电子邮件地址以计算在@ sign之前包含3个或更少字符的地址数(Parse email address in Oracle to count number of addresses with 3 or less chars before @ sign)我需要统计一个db中具有3个或更少字符的电子邮件地址数,例如[email protected]。Oracle中不存在parsename函数,..._oracle邮箱确认

Linux——systemctl 添加自定义服务_添加 systemctl-程序员宅基地

systemctl是RHEL 7 的服务管理工具中主要的工具,它融合之前service和chkconfig的功能于一体。可以使用它永久性或只在当前会话中启用/禁用服务。一、server文件位置systemd有系统和用户区分;系统(/user/lib/systemd/system/)、用户(/etc/lib/systemd/user/),一般系统管理员手工创建的单元文件建议存放在/etc/sys..._添加 systemctl

Linux查看端口使用情况、查看某个端口是否被占用、查看防火墙开放的端口情况-程序员宅基地

第一部分:端口1、查看端口情况:netstat -napl 2、查看UDP协议的端口:netstat -nupl 3、查看tcp协议的端口:netstat -ntpl 4、查看8080是否被占用:netstat -alnp |grep 8080 第二部分:防火墙1、查看防火墙开放的端口:firewall-cmd ...