yheartbeats的博客

使用此循环动画

1、text标签文字首行缩进。 tText { text-indent:2em; /*em是相对单位，2em即现在一个字大小的两倍*/ } 2、改变radio的默认大小。 radiot { transform:scale(0.6); }

线形渐变，为盒子绘制斜角【linear-gradient】 1、语法：linear-gradient(角度, 颜色1 长度1, 颜色2 长度2,…) 区块; 角度：确定渐变方向（向上为0deg，向右为90deg） 长度值：0%~100%；可以使用具体的值px; 区块：如把盒子平均分成四份（左上【left top】、右上、右下、左下）。 2、如【linear-gradient(135deg, transparent 30px, blue 0) left top;】 把盒子分成四块【background-si

通过@keyframes规则，可以创建动画 原理： 将一套css样式逐渐变为另一套css样式 用法：以百分比或“from”、“to”关键字来控制动画开始和结束。在动画过程中，可以多次改变这套css样式 animation是一个简写的属性，主要用于设置6个动画属性： animation-name:需要绑定到选择器上的keyframe的名字 animation-duration:完成动画所花费的时间（s、ms） animation-timing-function:动画的速度曲线 animatio

h5页面实现固定div内滚动实现方法： 注意： 因为h5页面没有scroll-view这样的组件，这里使用css实现滚动， 父元素flex布局，高度100%，页面从上到下正常铺，需要实现滚动的div css设置 flex = 1； overflow: scroll; //需要滚动的div样式设置 .scroll{ display:flex； flex = 1； overflow: scroll; } 实现效果： ...

box-sizing: border-box box-sizing: border-box； 将border和padding数值包含在width和height之内，这样的好处就是修改border和padding数值盒子的大小不变。 box-sizing属性的取值可以为content-box或border-box，对它们的解释如下： content-box：浏览器对盒模型的解释遵从W3C标准，当定义width和height时，它的参数值不包括border和padding。 border-box

border-radius 设置div为圆形 圆角 （1）设置宽高 ，如下图效果 （2）圆形 ：宽高设一致 ， 设置border-radius ：50% ， 圆角：宽高不一致 ，设置border-radius ： div 高度值 <div id="radius1"></div> <div id="radius2"></div> #radius1{ width: 50px

css不同大小字体底部对齐 1.默认是底部对齐； 2.flex布局底部对齐： 调字体小的文字的line-height。 FIGHTING