CSS注释格式:/*This is a comment*/
透明与模糊
opacity:0.5; /*透明度*/
filter: blur(4px); /*模糊毛玻璃效果(整个元素)*/
backdrop-filter: blur(20px); /*背景模糊毛玻璃效果(元素背后)*/
#text::before /*伪元素*/
{
content:'';
position:absolute;top: 0;right: 0;left: 0;bottom: 0;
filter:blur(5px);
background:#ffffff;
z-index:-1; /*层级关系*/
}
多个CSS合在一起写,中间用逗号分隔。
.block-a, .block-b{background-color:#ffffff00 !important;}
属性后插有 !important
的属性拥有最高优先级。详情参见CSS 样式优先级。
具有透明度的颜色
以白色半透明为例:
HEX:#ffffff80
RGBA:rgba(255, 255, 255, 0.5)
HSLA:hsla(0, 0%, 100%, 0.5)
水平居中
行内元素:style="text-align:center"
块级元素 :style="margin:auto"
、style="margin:0 auto"
、style="margin:10px auto"
WordPress特有居中:class="has-text-align-center"
WordPress多个图像同行显示居中示例:
<p class="has-text-align-center">
<img width="30%" src="https://img.crowya.com/media/cut_2020041000193919SS.png?x-oss-process=style/compress">
<img width="30%" src="https://img.crowya.com/media/cut_2020041000413941SS.png?x-oss-process=style/compress">
<img width="30%" src="https://img.crowya.com/media/cut_2020041000424042SS.png?x-oss-process=style/compress"><p>
在新窗口打开
<a href="链接的页面" target="_blank">新窗口打开</a>
<a href="链接的页面" target="_parent">原窗口打开</a>