CSS3新增常用样式

学习笔记 廖佳星

1. border-radius:10px 10px 10px 10px;      / 圆角边框/    

跟盒子边距一样,顺序是顺时针:左上角,右上,右下,左下角;

1个值为四个角取值,两个值为对应角取值;

值可以是 px 也可以是 % 

2:.background-size:宽 高;              /背景图片大小/

background-size:cover;               /背景图片铺满/

3.background:linear-gradient(red,blue);         /背景颜色渐变,默认上下渐变/

由于有多种方向渐变,个人觉得记住其中一种比较全面的就好,如下:

background:linear-gradient(180deg,red,blue);         image.png这个可以设置从哪个方向开始渐变,只需要输入角度就好!角度如上图!

4.圆角图片:跟圆角边框一样的使用方法,这里就不多讲了,可以去敲一下:

img{border-radius:10px}

5.自适应图片:img{

max-width:100%;

height:auto;

}

现在使用的比较少,之后学习自适应布局时应该会经常使用,现说这么多,欢迎补充!

还能输出{{restrictNumber}}个字符  
  • {{reply.author}}

    {{CommonUtil.formateDate(reply.ac_CommentDate).shortTime}}
  • 回复了{{Comments.author}} :