css
Jackshijin
多做少说
展开
-
圣杯布局&双飞翼布局
前言:上班划水偷空了解了一下圣杯布局和双飞翼布局,一听这两个名字,觉得不明觉厉,其实就是三栏布局,左右两边的盒子宽度固定,中间的盒子宽度自适应。以下内容均是总结互联网上别人的文章。觉得有意思就记录一下。。。圣杯布局,方法一:<style> .container{ padding: 0 200px; } .middle{ width: 100%; background:原创 2020-12-28 17:33:39 · 268 阅读 · 0 评论 -
CSS编写要注意的问题
css编写注意事项:1、导航菜单栏li标签里面嵌套a标签进行菜单的跳转,li标签应该跟头部的菜单栏高度一致符合用户使用习惯;写门户网站的时候能使用a标签进行链接的跳转就尽量不要使用事件点击来进行跳转;2、图片自适应铺满问题:图片资源一般使用两倍图,为了兼容iOS系统,iOS分辨率是安卓的两倍;background-size: 背景图片的尺寸:auto 按比例放缩铺满,no-repeat 不重复渲染背景图;3、按照设计图来进行还原的时候,width和height的值要减去margin paddin原创 2020-12-04 18:15:27 · 341 阅读 · 0 评论 -
一些常见图形的CSS实现
一些特殊图形的css画法:1、矩形:通过设置宽高,width=height就变成正方形 .box { width: 100px; height: 100px;}2、三角形:盒子的宽高设置为0,那边作为三角形的底哪边的border就设置为底的长,然后对应颜色设置为三角形需要的背景色,其他边的border-color设置为transparent(透明)最后是三角形的底为border的两倍,border-bottom 为三角形的高...原创 2020-12-04 18:06:59 · 267 阅读 · 0 评论 -
导航锚点小试牛刀
Offsettop 属性&导航锚点的实现记录一些视窗高度和滚动的一些属性以及导航菜单跟随内容变动以及点击锚点展示内容offsetParent 介绍:偏移量属性scrollHeight 和 scrollWidth ,可滚动的绝对高度,包括隐藏不可见的部分;scrollTop 和 scrollLeft :可滑动的元素,即元素出现滚动条时,内部在xy轴上滑动的距离,并且可以为其赋值,如果一个元素的内容没有产生垂直方向的滚动条,那么它的scrollTop值为0。Vue组件简单实现导航栏原创 2020-12-04 17:30:22 · 187 阅读 · 0 评论 -
选择器的特殊性
在css中可以选择多种方法来选择元素,设置元素的样式,但是最后元素的会遵从哪种方法所设置的样式呢?反正最终肯定只有一个规则可以胜出,所以会有一个判断标准来衡量这些方法的设置优先级,即优先显示哪种设置样式的判断规则。css权威指南中翻译为选择器的特殊性 。 对于每个规则,用户代理会计算选择器的特殊性,并将这个特殊性附加到规则中的各个声明。如果一个元素有两个或者多个冲突的样式声明,最高特殊性的声明就会...原创 2019-04-06 10:56:03 · 293 阅读 · 0 评论 -
元素居中的方法
1、利用flex布局实现:.content { display: flex; flex-direction: column; /*布局方向,flex-direction为row也可以实现居中*/ justify-content: center; /*竖直方向居中*/ align-items: center; /*水平居中*/}2、ma...原创 2019-09-01 22:46:27 · 170 阅读 · 0 评论