css 伪元素居中对齐

 .demo {display: flex;padding: 40px;}.demo::after {content: '';display: inline-block;background-color: #717171;width: 80%;height: 1px;margin: auto; // 伪元素居中line-height: 100px;align-items: center;text-align: center;vertical-align: middle;}

 <div className={'demo'}><h1>ThreeJs Mini Demo</h1></div>

结果：

其他

css 伪元素居中对齐相关推荐

【CSS 属性】 text-align属性应用☞ 一个属性解决文本居中对齐和元素居中对齐
这里写目录标题 1. text-align属性介绍 2. 文本居中 3. 元素居中对齐 1. text-align属性介绍 text-align CSS属性定义行内内容(例如文字 )如何相对它的块父元 ...
CSS实现元素居中原理解析
原文:CSS实现元素居中原理解析在 CSS 中要设置元素水平垂直居中是一个非常常见的需求了.但就是这样一个从理论上来看似乎实现起来极其简单的,在实践中,它往往难住了很多人. 让元素水平居中相对比较简 ...
弹性盒子内容体居右对其_CSS怎么实现弹性盒中的元素居中对齐
css实现元素对齐(居中对齐弹性盒的各项元素),在我们网页设计中是较为常见的一个功能效果.我们可以通过css中的align-items等相关css属性来实现. 推荐参考:<CSS教程> ...
【CSS】元素居中总结-水平居中、垂直居中、水平垂直居中
[CSS]元素居中一. 水平居中 1.行内元素水平居中 (1)text-align 2.块级元素水平居中 2.1 margin (1)margin 2.2布局 (1)flex+ justify-co ...
css 伪元素和浮动
展示为行内元素 inline-block <style>div {/* 浏览器解析行内块或行内标签的时候, 如果标签换行书写会产生一个空格的距离, 展示为行内元素 */display: i ...
css 伪元素::after与::before的使用
CSS伪元素是用来添加一些选择器的特殊效果. 一般使用是类或者id::after , 类或者id::before ::after是在类的后面处理逻辑 ::before 是在先的前面处理逻辑它们都 ...
css 商城两列_如何使用css伪元素实现超实用的图标库（附源码）
今天我们来复盘一下前端中css伪元素的知识以及如何用css伪元素来减轻javascript的压力,做出一些脑洞大开的图形. 预备知识伪元素伪元素是一个附加至选择器末的关键词,允许你对被选择元素的特 ...
用CSS伪元素制作箭头
现在让我们开始制作箭头吧! 在开始前,你要知道如何用CSS去画一个三角形,如果还不清楚可以看看这里纯CSS画各种图形我们用到两个CSS伪元素,before和after,它们属于行内元素,但可以用di ...
[JS 分析] 汽_车_之_家 JS 生成 CSS 伪元素 hs_kw44_configUS::before
0.参考 https://developer.mozilla.org/zh-CN/docs/Web/CSS/Pseudo-elements https://developer.mozilla.org/ ...

css 伪元素居中对齐

css 伪元素居中对齐

其他

css 伪元素居中对齐相关推荐

最新文章

热门文章