www.iconfont.cn/help/detail?spm=a313x.7781069.1998910419.d8d11a391&helptype=code
·对话框三角形
先建立一个盒子,设置这个盒子的高度和宽度均为0px,设置四个border值为一样的,若是想让三角形朝向上,则除了border-bottom带有颜色,其他三个border均为透明色(transparent);同样的,若是想朝向右,就让除了左之外的三个盒子均为透明色即可。然后使用绝对定位的方式调整三角形的位置。最终即可实现对话框的样子。
·图片与文字对齐
默认地,图片与文字是按照基线对齐的。除此以外,图片还可以与文字按照顶线、中线与底线进行对齐。
这一样式是使用属性vertical-align进行设定的。要想使图片与文字居中对齐,就要设定为middle。
baseline:元素基线与父元素基线对齐,默认值
bottom:元素底部与父元素底部对齐
top:元素顶部与父元素顶部对齐
middle:元素中线与父元素中线对齐
top: 与父元素顶部对齐
·鼠标样式
设置或检索在对象上移动的鼠标指针采用不同种系统预定义的光标形状
·去掉输入框的蓝色轮廓线
给表单添加 outline: 0;或者 outline:none;样式之后,就可以去掉默认的蓝色边框
·防止拖拽文本域
textarea {resize: none; }
·图片模糊
使图片模糊需要用到css中的filter中的blur()函数,()中填入模糊像素,数值越大,图片越模糊。
·计算盒子宽度或高度
计算盒子宽度和高度需要用到 calc() 函数,如图代码,可以保证盒子的宽度可以永远保持比父级盒子的宽度小30px。
·过渡效果
过渡( transition)是CSS3中具有颠覆性的特征之一,我们可以在不使用Fash动画或
JavaScript的情况下,当元素从一种样式变换为另一种样式时为元素添加效果。
过渡动画:是从一个状态渐渐的过渡到另外一个状态,可以让我们页面更好看,更动感十足,虽然低版本浏览器不支持(ie9以下版本)但是不会影响 面布局 。
我们现在经常和 hover一起搭配使用。 谁做过渡给谁加!
transition:要过渡的属性 花费时间 运动曲线 何时开始;