css 未知子元素宽高的居中
.parent{
position:relative;
}
.child{
position:absolute;
left:50%;
top:50%;
transform:translate(-50%,-50%);
}
使用 translate 对子元素的宽高没有要求,在未知宽高的情况下依然适用。
这种方式在子元素是单行或多行文本的时候要求垂直居中的情况下十分适用。
css 未知子元素宽高的居中的更多相关文章
- CSS子元素居中(父元素宽高已知,子元素未知)
<style> .container{width:400px; height:400px; position:relative;} .center{position:absolute; l ...
- css使子元素在父元素居中的各种方法
html结构: <div class="parent"> <div class="child"></div> </di ...
- canvas基础入门(一)canvas的width、height于css样式中的宽高区别
canvas的width.height于css样式中的宽高对画布的内容显示是有所区别的 1.在canvas标签下调用他的width和height,而且是没有单位的宽高,这种指定canvas大小的方法也 ...
- 原生JS获取元素宽高实践详解
开篇的话 任何不是亲身实践中求得的知识,都不是属于你的.任何求得的知识不去时常温习运用,也不是属于你的. 记录由来 在做个上拉广告功能中遇到了一个"理所当然"觉得对的用法,慢慢才排 ...
- js获取隐藏元素宽高的方法
网上有一些js获取隐藏元素宽高的方法,但是可能会存在某些情况获取不了. 例如: <!DOCTYPE html> <html lang="en"> <h ...
- 007. 自定义ListBox的item的宽高, 字体居中
/// <summary> /// 自定义ListBox的item的宽高, 字体居中 /// </summary> /// <param name="sende ...
- js获取精确的元素宽高(普通获取高度会有误差)
当js获取元素宽高时, 并不是一个精确的数字,如果想获取真正的宽高大致方法如下 var oStyle = obj.currentStyle ? obj.currentStyle : window.ge ...
- HTML&CSS基础-子元素和后代元素选择器
HTML&CSS基础-子元素和后代元素选择器 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.html源代码 <!DOCTYPE html> <html ...
- HTML&CSS基础-子元素的伪类选择器
HTML&CSS基础-子元素的伪类选择器 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.html的源代码 <!DOCTYPE html> <html& ...
随机推荐
- MySQL基础练习02---牛客网
目录 1. 从titles表中获取title并按照title分组 2.从titles表中获取title并按照title分组,重复的emp_no忽略 3 查找employees表 4 统计平均工资 5 ...
- which/whereis
which 查找二进制命令,按环境变量PATH路径查找 whereis 查找二进制命令,按环境变量PATH路径查找 查询命令的安装路径,配置文件路径
- Linux网络命令——ifconfig、ifup、ifdown
这三个命令的用途都是启动网络接口,不过,ifup 与 ifdown 仅就 /etc/sysconfig/network- scripts 内的 ifcfg-ethx(x为数字)进行启动或关闭的操作,并 ...
- 一个轻量级的模态组件,“礼貌地”要求您的用户停止使用过时的IE浏览器
插件github地址:https://github.com/panteng/ie-blocker 我们在做项目时,会考虑到浏览器的兼容问题,当然做,全浏览器都支持的项目我还没经历过,也不想经历,目前做 ...
- 网站快速收录/站点快速收录/seo快排技术/seo快速排名/泛域名快速收录/泛目录快速收录
泛目录技术是目前最快速最有效的办法,增加站点的收录方面,这里推荐莲花泛目录 莲花泛目录,完善的技术支持,代码亲自编写,独立研发.业界领先. (这个是seo关键词,请无视,直接看下面的泛目程序介绍)网站 ...
- 微服务RESTful 接口设计规范
1.RESTful发展背景及简介 网络应用程序,分为前端和后端两个部分.当前的发展趋势,就是前端设备层出不穷(手机.平板.桌面电脑.其他专用设备......).因此,必须有一种统一的机制,方便不同的前 ...
- sql 查询存在一个表而不在另一个表中的数据
方法一(效率底) select A.* from 办卡 A where A.namedh not in (select namedh from 银行) 方法二(效率中) select A.* from ...
- CSS3 新特性
~平时喜欢逛博客,看别人的学习总结和遇到的问题解决办法,恰好最近在做书签整理,翻到了之前一个前辈移动前端的总结,所以我就按他的总结模块对自己的知识进行了梳理,不过由于都是手写的,为了方便,下面的都是平 ...
- java 日志文件打印
java中的日志打印 java中的日志打印: 日志工具类: log4j.properties解释: 1 1.输出级别的种类 2 ERROR.WARN.INFO.DEBUG 3 ERROR 为严 ...
- AB窗体互传参数本质
一.找了好几个,都不靠谱,不是说不靠谱,自己感觉太繁琐,根本就是本窗体的属性(对象)的传递,1实例化2把实例化后的窗体属性=本窗体的对象 二.传递的的时候都是在互相引用的时候传递,推荐的个人认为最简单 ...