![](https://img-blog.csdnimg.cn/20190927151117521.png?x-oss-process=image/resize,m_fixed,h_224,w_224)
CSS3
文章平均质量分 79
css and css3
LavanSum
这个作者很懒,什么都没留下…
展开
-
CSS基础--总结文章
1、水平垂直居中布局(一)https://www.html.cn/qa/css3/19614.html--(二)https://m.html.cn/qa/css3/15320.html--重点: 对于Web开发者来说,网页布局一直是个比较重要的问题。但实际上,在网页开发很长的一段时间当中,我们甚至没有一个比较完整的布局模块。总的来说 Web 布局经历了以下四个阶段: 1、table表格布局,通过 Dreamweaver 拖拽表格或者手写 table 标签布局 2、flo...原创 2021-05-20 10:27:13 · 132 阅读 · 0 评论 -
CSS Float(浮动)的原理和工作方式,以及浮动造成的问题总结
什么是 CSS Float(浮动)?CSS 的 Float(浮动),会使元素向左或向右移动,其周围的元素也会重新排列。Float(浮动),往往是用于图像,但它在布局时一样非常有用。浮动元素会生成一个块级框,而不论它本身是何种元素。如果浮动非替换元素,则要指定一个明确的宽度;否则,它们会尽可能地窄。注释:假如在一行之上只有极少的空间可供浮动元素,那么这个元素会跳至下一行,这个过程...原创 2018-07-31 18:06:52 · 4945 阅读 · 0 评论 -
CSS属性进阶
1、hover属性只会在hover的时候有效果,失去hover后同时失效。 2、鼠标悬浮在元素上时触发伪元素样式改变的写法#bmap:after { content: ''; position: absolute; top: 0px; right: 0px; width: 50px; height: 40px; background-color: red;...原创 2018-07-14 12:32:35 · 193 阅读 · 0 评论 -
css3硬件加速
动画卡顿是在移动web开发时经常遇到的问题,解决这个问题一般会用到css3硬件加速。css3硬件加速这个名字感觉上很高大上,其实它做的事情可以简单概括为:通过GPU进行渲染,解放cpu。现象通过对比不使用css3加速和使用css3加速两个例子,我们可以看到两者渲染的差异:不使用css3加速.png使用css3加速.png前者通过改变top和left属性进行动画,fps维持在47左右,cpu一直进行...转载 2018-07-14 11:30:17 · 1861 阅读 · 0 评论 -
50道CSS基础面试题(附答案)
1 介绍一下标准的CSS的盒子模型?与低版本IE的盒子模型有什么不同的?标准盒子模型:宽度=内容的宽度(content)+ border + padding + margin低版本IE盒子模型:宽度=内容宽度(content+border+padding)+ margin2 box-sizing属性?用来控制元素的盒子模型的解析模式,默认为content-boxcontext-box:W3C的标准...转载 2018-07-11 15:23:21 · 194 阅读 · 0 评论 -
CSS中伪类及伪元素用法详解
CSS中伪类及伪元素用法详解伪类的分类及作用:注:该表引自W3School教程伪元素的分类及作用:接下来让博主通过一些生动的实例(之前的作业或小作品)来说明几种常用伪类的用法和效果,其他的读者可以自己尝试: :active 大致效果为用鼠标点击时,元素增加特效,鼠标松开时,特效消失。多用在按钮的点击上。 写法:这里id为box的是一div块,在css中首先设置了他的基本样式,下面为加入:activ...转载 2018-07-11 15:12:42 · 296 阅读 · 0 评论 -
CSS3动画:animation、transition、transform、translate傻傻分不清
利用物理上的平移、旋转、以及视觉上的过渡等实现??前言在平时开发过程中,由于都是自己捣鼓玩的项目,并没有UI设计给我的设计图,更没有什么特效要求,导致对css动画一直都不是很熟悉,但是作为即将进入实习单位的萌新程序员,要时刻准备着设计师要求的各种动画,于是有了这一篇文章。容易混淆的几个css属性css属性很多,并且有些无论是字母的拼写还是字面上的意思,都容易混淆,比如我列出来的几个属性,是不是也混...转载 2018-07-11 15:15:45 · 405 阅读 · 0 评论