CSS案例
详细展示CSS不同标签属性的案例
寒冰1307
这个作者很懒,什么都没留下…
展开
-
CSS系列012-清除浮动三种方法
2、多创建一个格子,添加clear: both;3、添加一个虚拟标签。原创 2023-03-19 23:56:44 · 178 阅读 · 0 评论 -
CSS系列011-position
absolute:绝对定位,相对于第一个非 static 定位的父级元素进行定位,可以通过 top、right、bottom、left 这 4 个属性来设置元素相对于父级元素位置的偏移量。如果没有满足条件的父级元素,则会相对于浏览器窗口来进行定位。使用固定定位的元素无论如何滚动浏览器窗口元素的位置都是固定不变的。relative:相对定位,即相对于自身定位,不脱离文档流,可以通过 top、right、bottom、left 这 4 个属性来设置元素相对于正常位置的偏移量,在此过程中不会对其它元素造成影响。原创 2023-03-19 23:53:16 · 188 阅读 · 0 评论 -
CSS系列010-双飞翼布局
题目:写一个左中右布局占满屏幕,其中左、右俩块固定宽200,中间自适应宽,要求先加载中间块,请写出结构及样式。原创 2023-03-19 23:07:13 · 148 阅读 · 0 评论 -
CSS系列009-display:none和visibility:hidden的区别
visibility-hidden隐藏元素,但是会占用位置。display:none隐藏元素,且不会占用位置。二者都是隐藏,不显示元素。原创 2023-03-19 22:41:39 · 50 阅读 · 0 评论 -
CSS系列008-opacity和rgba区别
rgba:r表示red红色,g表示green绿色,b表示blue蓝色,取值在0 - 255之间,a表示透明度,取值在0 - 1之间。opacity会继承父元素的opacity属性,而rgba的后代元素不会继承不透明属性。opacity:取值范围0 - 1之间,0表示完全透明,1表示不透明。共同点:实现透明效果。原创 2023-03-19 22:42:11 · 131 阅读 · 0 评论 -
CSS系列007-浏览器滚动溢出问题
contain:默认的滚动溢出行为将被内部的元素观察到,但相邻的区域不会产生连续滚动效果。overscroll-behavior-x:这个css属性用来控制当滚动到区域的水平边界时的浏览器行为。- none:相邻的滚动区域不会有连续滚动效果,且默认的滚动溢出行为会被阻止。- auto:默认的滚动溢出行为表现的和正常一样。原创 2023-03-19 22:38:31 · 251 阅读 · 0 评论 -
CSS系列006——居中
四、flex弹性布局居中。原创 2023-03-13 08:20:45 · 141 阅读 · 0 评论 -
CSS系列005——画直线
【代码】CSS系列005——画直线。原创 2023-03-10 22:59:11 · 1365 阅读 · 0 评论 -
CSS系列004——侧边栏模拟百度新闻热榜
【代码】CSS系列004——侧边栏模拟百度新闻热榜。原创 2023-03-10 22:57:28 · 344 阅读 · 0 评论 -
CSS系列003——文字剪纸效果
【代码】CSS系列003——文字剪纸效果。原创 2023-03-10 22:55:19 · 171 阅读 · 0 评论 -
CSS系列002——变量currentColor
效果如图,改变父元素颜色,会使得子元素颜色一起改变。变量currentColor的用法。原创 2023-03-10 22:53:53 · 94 阅读 · 0 评论 -
CSS系列001 —— 画三角形
使用CSS画三角形,代码如图。原创 2023-03-10 22:50:52 · 44 阅读 · 0 评论