css
关注
分享
扫一扫
卷尾猫
https://gitee.com/yylcode
展开
-
css position定位属性各属性
absolute 生成绝对定位的元素，相对于static定位以外的第一个父元素进行定位，元素的位置通过 left，top，right，bottom来进行规定。 fixed 生成绝对定位的元素， 相对于浏览器窗口进行定位，元素的位置通过left，top，right，bottom来进行规定。 relative 生成相对定位的元素，相对于其正常位置进行定位，因此，left:20px 会向元素的lef...原创 2020-04-24 17:18:13 · 198 阅读 · 0 评论 -
CSS box-sizing 两种属性 border-box,content-box
box-sizing 是什么？css的盒子模型box model 不会将padding与border计算到容器（如div）的宽高中的，这就导致你所设定的容器宽度未必是最终宽度（需要加上padding与border）.因此有了box-sizing：border-box的设定，其效果就是将padding和border纳入容器宽高如何应用box-sizing多用与所有css选择...原创 2020-04-24 17:00:28 · 2273 阅读 · 0 评论 -
CSS3现状，新增选择器，2D、3D转换，动画等知识详解
目录1. css3现状2. 属性选择器3. 结构伪类选择器4. 伪元素选择器5. 2D转换5.1 二维坐标系5.2 2D转换之移动translate5.3 2D转换之旋转rotate5.4 2D转换的中心点5.5 2D转换之缩放scale5.6 2D转换综合写法6. 动画6.1 动画的基本使用6.2 动画常用属性6.3 动画简写属性...原创 2020-04-18 22:15:46 · 742 阅读 · 0 评论 -
移动端布局最全基础知识+流式布局 学习记录
1.移动端基础1.1浏览器现状*国内的UC和QQ，百度等手机浏览器都是根据Webkit修改过来的内核，国内尚无自主研发的内核，就像国内的手机操作系统都是基于Android开发的一样*兼容移动端主流浏览器，处理Webkit内核浏览器即可1.2手机屏幕现状*移动端设备屏幕尺寸非常多，...原创 2020-04-14 19:44:30 · 425 阅读 · 0 评论 -
移动端px/rem换算
这是设计图为750， 设计图尺寸不同，更改相应设置即可。(function flexible (window, document) { var docEl = document.documentElement var dpr = window.devicePixelRatio || 1 // adjust body font size function setBodyFo...原创 2020-04-10 09:32:49 · 304 阅读 · 0 评论 -
flex布局原理以及各属性详解
1 布局原理1.1flex是flexibleBox的缩写，意为“弹性布局”，用来为盒状模型提供最大的灵活性，任何一个容器都可以指定为flex布局*当我们为父盒子设为flex布局以后，子元素的float、clear和vertical-align属性将失效*伸缩布局=弹性布局=伸缩盒布局=弹性盒布局=flex布局...原创 2020-04-13 17:03:59 · 1289 阅读 · 0 评论 -
css实现各种形状，三角形、切角、梯形、五边形、六边形、八边形、五角星
直接上代码，注释很清晰。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-...原创 2020-03-11 18:41:36 · 1758 阅读 · 0 评论