css
文章平均质量分 53
limyuer
这个作者很懒,什么都没留下…
展开
-
icon-Share
:before :after伪元素原创 2017-12-07 10:13:45 · 415 阅读 · 0 评论 -
两列布局(左边固定,右边自适应)
最快速的方法flex布局而且左右盒子的高度一定相等<div class="warp"> <div class="left" id="left">left</div> <div class="right" id="right">right</div>原创 2018-03-12 14:14:34 · 404 阅读 · 0 评论 -
css-currentColor / inherit
currentColor“当前颜色” 指本体color , 如果没有设置color就找父元素,一级一级找,一直到根元素位置 inherit 继承,除了颜色别的例如字体等都可以继承. html:div class="box"> a href="#">currentColora> p>currentColorp> input type="text" v原创 2018-01-30 11:19:25 · 649 阅读 · 1 评论 -
理解BFC
前期了解Box、Formatting Context的概念: Box: CSS布局的基本单位 Formatting context: 页面中的一块渲染区域Box分类:(css2.1) block-level box 和 inline-level BoxBox、Formatting Context分类 Block Formatting Context (BFC) Inline ...原创 2018-02-26 12:26:21 · 152 阅读 · 0 评论 -
按钮组
目的:主要是练习结构化,标签意义化,根据火热的bootstrap来加深自己结构化的理解。还可以学习它的css样式以及css顺序。没有加js交互~ html:<div class="drop-down-menu"> <button class="btn"> Dropup <span class="triangle"></span> </button>原创 2018-01-18 17:40:09 · 236 阅读 · 0 评论 -
CSS-rem的使用
了解em em 的计算是基于父级元素的font-size,有复杂的层级关系,不做考虑了。重点rem( root element) rem相对的是根节点html的font-size( rem是css3中新增加的一个单位值, 它绕开了复杂的层级关系,实现了类似于em单位的功能。)什么时候用 rem? 是不是在所有地方都去使用呢?别捉急,通常在标题,正文等大面积文字的位置可以使用 rem。但是在一些原创 2018-01-18 15:39:48 · 1021 阅读 · 0 评论 -
伟大的position定位
position定位1.position : static | absolute | fixed | relative声明定位方式top right bottom left z-index具体位置以及层叠的高低2.具体介绍(1)static:无特殊定位(top, bottom, left, right 或者 z-index无作用)。(2)absolute:绝对定位。原创 2018-01-16 11:19:56 · 132 阅读 · 0 评论 -
CSS背景
css背景总结首先总结一下css背景属性: background-color(背景颜色) background-image(背景图片) background-repeat(背景重复) background-attachment(背景关联) background-position(背景定位) background-size(背景图片大小)原创 2018-01-04 16:26:24 · 147 阅读 · 0 评论 -
css命名规范
css命名规范1.根据领域名词命名 例如 我们在相应的模块需要用领域名词进行扩展。2.根据不同的级别,对类进行不同命名 base 初始化和原子类 (简单点) common 模块化 (尽量域名规范命名) page 组件 (对域名规范进行扩展命名)举个栗子 这是我自己写的demo,有错误希望能够指出来,共同进步~原创 2018-01-04 12:40:05 · 152 阅读 · 0 评论 -
demo-HC-下拉菜单
下拉菜单:点击出现下拉列表(未实现js交互)原创 2017-12-07 11:45:15 · 224 阅读 · 0 评论 -
移动端1px如何是实现
思考:为什么移动端的1px会变粗我们需要清楚,css中1px不等于移动端的1px原因:手机像素密度不同(dpr = 物理像素/设备独立像素 )最好的解决办法viewport + rem 实现<!--当dpr=2时--><meta name="viewport" content="initial-scale=0.5, maximum-scale=0.5,...原创 2018-03-12 15:06:41 · 661 阅读 · 0 评论