CSS代码
各种css
GllWyz
你所见即我,好与坏都不反驳
展开
-
CSS / 伪元素
说明:按照规范,伪元素应该使用双冒号(::)而不是单个冒号(:),以便区分伪类和伪元素。但是,由于旧版本的 W3C 规范并未对此进行特别区分,因此目前绝大多数的浏览器都同时支持使用这两种方式来表示伪元素优点一:伪元素是一个元素的子元素,并且还inline行内元素,因为伪元素是伪的,所以你无法用JS获取到这个伪元素,或者增删改查一个伪元素,这也就是伪元素的优点—你可以使用伪元素制造视觉上的效果,...原创 2019-09-11 11:50:04 · 337 阅读 · 0 评论 -
隐藏滚动条但不影响滚动
前情提要:我的子元素的总高度超过了100%,所以会出现滚动条要求:滚动条隐藏,但是还可以滚动,兼容各种浏览器【我测试了谷歌、IE、搜狗、QQ浏览器都是可以的】代码:html{ height: 100%; width: 100%; overflow: -moz-hidden-unscrollable;}body{ height: 100%; width: 100...原创 2019-11-27 09:59:32 · 1270 阅读 · 0 评论 -
CSS / text-shadow阴影效果
一、定义解释1、属性 box-shadow是css3的一个新属性2、参数 box-shadow的四个参数(1)h-shadow:必需、水平阴影的位置、允许负值(2)v-shadow:必需、垂直阴影的位置、允许负值(3)blur:可选、模糊距离【既然是距离肯定就不会是负值,下面的也是一个道理】(4)color:可选、阴影的颜色3、方向问题 h-shad...原创 2019-08-10 15:29:38 · 1129 阅读 · 0 评论 -
CSS / box-shadow阴影效果
一、定义解释1、属性 box-shadow是css3的一个新属性2、参数 box-shadow的六个参数(1)h-shadow:必需、水平阴影的位置、允许负值(2)v-shadow:必需、垂直阴影的位置、允许负值(3)blur:可选、模糊距离【既然是距离肯定就不会是负值,下面的也是一个道理】(4)spread:可选、阴影的大小(5)color:可选、阴影的...原创 2019-08-09 20:03:46 · 880 阅读 · 0 评论 -
CSS / object-fit实现功能【实现:全屏放大、等比例缩小、裁剪放大】
1、实例效果图2、解释说明fill被替换的内容正好填充元素的内容框。整个对象将完全填充此框。如果对象的宽高比与内容框不相匹配,那么该对象将被拉伸以适应内容框。contain被替换的内容将被缩放,以在填充元素的内容框时保持其宽高比。 整个对象在填充盒子的同时保留其长宽比,因此如果宽高比与框的宽高比不匹配,该对象将被添加“黑边”。cover被替换的内容在保持其宽高比...原创 2019-08-13 14:52:17 · 614 阅读 · 0 评论 -
CSS / flex 弹性布局详解
结合了:https://blog.csdn.net/kk_yanwu/article/details/80658422和https://www.cnblogs.com/liyu2012/p/5525609.html两位作者的作品,进行整改代码:<div class="one"> <div>1</div> <di...原创 2018-10-08 14:53:03 · 659 阅读 · 0 评论 -
CSS / 比较常用的三角及border用法
1、上三角<div id="up"></div>#up {width: 0;height: 0;border-left: 10px solid transparent;border-right: 10px solid transparent;border-bottom: 20px solid red;}2、下三角<div...原创 2017-10-16 15:50:24 · 966 阅读 · 0 评论 -
CSS / form outline submit
1、<input type="submit" />在浏览器中的显示会默认有提交,添加value="" ,可以去掉2、<input type = "text" />会有高亮 ,添加outline:none,可以去掉高亮原创 2017-11-02 15:23:32 · 260 阅读 · 0 评论