css - Cooper's Blog

vue css样式

2024-01-10 Cooper Zhu technology vue3 front-end css

* **scoped： **仅影响当前组件下所有DOM节点、子组件根节点； * 非scoped：影响整个页面下所有DOM节点；（即会影响页面内其他组件下的DOM节点）； * 组件内隔离方案： style声明为module，且在HTML节点上使用:class="[$style.class1, .., $style.classN]"； * 为避免受父组件样式影响，创建组件叶，应使用空样式div包含有效DOM元素； 1 scoped原理场景：需要修改当前组件，或子组件根节点的样式，同时不影响页面内其他组件样式

CSS——Simple Admin Layout

2023-12-07 Cooper Zhu technology front-end css

see: github 1 示例一 1.1 HTML <!doctype html> <html lang="en"> <head> <meta charset="

CSS——水平垂直居中

2023-11-14 Cooper Zhu technology front-end css

可组合水平居中 + 垂直居中进行配置 * 水平居中：https://blog.cooperzhu.com/css-shui-ping-ju-zhong/ * 垂直居中：https://blog.cooperzhu.com/css-chui-zhi-ju-zhong/ 1 居中文本 1.1 居中单行文本 1.1.1 text-align: center; line-height=

CSS——垂直居中

2023-11-14 Cooper Zhu technology front-end css

1 居中文本 1.1 居中单行文本 1.1.1 line-height = height <div style="height: 100px; line-height: 100px; background-color: #F2C679"> 垂直居中 </div&

CSS——水平居中

2023-11-14 Cooper Zhu technology css front-end

1 居中文本 * 居中文本一般用于块级元素。如div * 如果需要行内元素（如span）居中文本，那么需要将其设置display: block 1.1 居中单行文本见“居中多行文本”。见1.2 1.2 居中多行文本同时适用于“居中单行文本” 1.2.1 text-align: