css3学习1

时光毁灭记忆、已成空白 提交于 2019-12-13 14:06:02

1。边框 转自https://www.runoob.com/css3/css3-borders.html

border-radius  圆角,例子 border-radius:25px

border-shadow 盒阴影 ,例子 border-shadow:10px 10px 5px #888888;

border-image 边界图片,例:border-image:url(border.png) 30 30 round;

2.背景 转自 https://www.runoob.com/css3/css3-backgrounds.html

background-image 背景图片,例

{background-image:url(img_flwr.gif),url(paper.gif);

 background-position:right botton,left top;

background-repeat:no-repeat,repeat;

}

另可

 { background: url(img_flwr.gif) right bottom no-repeat, url(paper.gif) left top repeat; }

background-size 背景图片大小。例 background-size:80px 60px;配合backgroud-repeat:repeat no-repeat

完全填充

{ background:url(img_flwr.gif); background-size:100% 100%; background-repeat:no-repeat; }

 

background-Origin 属性,指定背景适用的位置,可选 border-box,padding-box,content-box

 

多个背景图片 background-image:url(img_flwr.gif),url(img_tree.gif) 

background-clip 背景剪裁,例 background-clip:content-box;

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!