![](https://img-blog.csdnimg.cn/20201014180756928.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
HTML/CSS
J1ong
心不妥协,行不受阻
展开
-
设置网页特定字体
1、首先得有相关字体的文件,加入到项目中 2、配置引入字体的文件 // 引入数字字体 @font-face { font-family: 'digits'; src: url('../assets/fonts/digits.ttf') format('truetype'); } 3、使用 4、效果原创 2022-03-14 17:24:34 · 605 阅读 · 0 评论 -
绝大多数浏览器滚动条样式兼容性写法
* { scrollbar-color: #ffffff rgba(0,0,0,0.4); /* 滑块颜色 滚动条背景颜色 */ scrollbar-width: thin; /* 滚动条宽度有三种:thin、auto、none */ } /*滚动条样式*/ *::-webkit-scrollbar{ width: 8px; } *::-webkit-scrollbar-thumb{ border-radius: 5px; height: 50px; background-colo原创 2021-12-02 09:06:43 · 1054 阅读 · 0 评论 -
display、visibility和opacity隐藏元素的区别
前言:display:none,visibility:hiddren和opacity:0在某种程度上可以实现对html元素的隐藏,但还是有所区别的,具体结合业务场景应用。 隐藏元素的方法 隐藏后是否占据页面空间 隐藏后是否还产生交互(如hover,click等) display:none 否 否 visibility:hiddren 是 否 opacity:0 是 是 ...原创 2020-07-21 16:10:04 · 245 阅读 · 0 评论 -
CSS让元素水平垂直居中的常用方法
一、定宽居中 方法1 position:absolute; top:50%; left:50%; margin-top:-50px; /*假定元素高为100px*/ margin-left:-50px; /*假定元素宽为100px*/ 方法2 position:absolute; top:0; right:0; bottom:0; left:0; margin:auto; 二、不定宽居中 方法1 position:absolute; top:50%; left:50%; transform:transl原创 2020-05-19 16:11:19 · 163 阅读 · 0 评论