3月17日一一圆角属性的学习心得

圆角属性的学习心得
测试注意点：
如何做到元素的显示与隐藏（元素位置保留）
opacity：0；
opacity：1；
如何做到元素的显示与隐藏（不保留元素位置）
display:block；
display:none;
新知识：
圆角样式与渐变色
1.圆角样式
（1）格式：border-radius
取值：
一个值：相当于四个角的取值
两个值：对角线（左上右下 右上左下）
三个值：左上 右上左下 右下
四个值：左上 右上 右下 左下
单位：像素值（百分比：相对于父级来说）
（2）如何切出半圆？
设置高度为宽度的一半
并且半径等于宽度
（3）如何切出扇形？
只设置一个方向的值，注意先写上下，在写左右：如：border-top（bottom）-left（right）：（像素值／百分比）；
重点：
一个方向：顺时针
一个对角
2.渐变色
线性渐变
（1）渐变色属于图片
linear-gradient
（重点）注意格式：background-image:linear-gradient（方向，颜色，渐变的范围（百分比或者像素值））;
方向：角度（deg），关键词to left（right/ top/bottom／top left/right）
径向渐变
（1）改变的是圆心，不是方向：at bottom left（像素值定位）
复合属性（多重背景）
线性和渐变和背景颜色
注意：颜色设置在最后
问题：
为什么text-align放在父级元素？
为什么vertical-align放在子元素？