css
曦曦湘涟
web前端
展开
-
鼠标悬停 -css如何实现鼠标移至图片上显示遮罩层及文字
搜索这个效果的时候,很多人都是用css结合jQuery实现的,其实直接用css也可以实现哦~效果前:效果后:代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=d...原创 2020-02-20 23:00:33 · 5502 阅读 · 0 评论 -
使用css3制作一个简易的环形进度条
css: section { width: 2rem; height: 2rem; position: relative; margin: 2rem; } .wrap, .circle, .percent { ...转载 2020-02-18 17:27:39 · 288 阅读 · 0 评论 -
CSS水平居中+垂直居中+水平/垂直居中总结
目录水平居中 行内元素 块级元素 方案一:(分宽度定不定两种情况) 方案二:使用定位属性 方案三:使用flexbox布局实现(宽度定不定都可以)垂直居中 单行的行内元素 多行的行内元素 块级元素 方案一:使用定位 方案二:使用flexbox布局实现(高度定不定都可以)水平...转载 2020-01-18 15:08:29 · 185 阅读 · 0 评论 -
BFC原理
一、常见定位方案在讲 BFC 之前,我们先来了解一下常见的定位方案,定位方案是控制元素的布局,有三种常见方案:普通流 (normal flow)在普通流中,元素按照其在 HTML 中的先后位置至上而下布局,在这个过程中,行内元素水平排列,直到当行被占满然后换行,块级元素则会被渲染为完整的一个新行,除非另外指定,否则所有元素默认都是普通流定位,也可以说,普通流中元素的位置由该元素在 HTM...转载 2020-01-18 15:27:50 · 171 阅读 · 0 评论 -
px、em、rem的区别
pxpx是英文pixel的缩写,意思是像素,为相对长度单位。像素px是相对于显示器屏幕分辨率而言的。特点IE无法调整那些使用px作为单位的字体大小;国外的大部分网站能够调整的原因在于其使用了em或rem作为字体单位;Firefox能够调整px和em,rem,但是96%以上的中国网民使用IE浏览器(或内核)。emem是相对长度单位,相对于父级元素的字体大小,所以em的值...原创 2020-01-09 12:48:17 · 478 阅读 · 0 评论 -
W3C标准盒模型与IE盒模型区别
今天被这两个盒模型搞得有点晕。。。。。。最初的时候是看菜鸟教程学习的,菜鸟上的盒模型解释是这样的刷面试题的时候牛客网上的盒模型的面试题答案是这样的what?怎么同样是说盒模型的宽度,却是不同样的解释?接着我去MDN上搜,MDN上好像没IE盒子模型的解释,不知道是不是我没看清楚还是怎么的,但是我终于知道这是为什么了接着,问题又来了,我太难了,这个IE模型究竟是怎么回事呢?然后我去看大神...原创 2020-01-08 00:14:59 · 211 阅读 · 1 评论