CSS3中的background-clip属性的用法:【background-clip:border-box|padding-box|content-box】。background-clip属性用于规定背景的绘制区域。
css background-clip属性
作用:规定背景的绘制区域。
(推荐教程:CSS教程)
语法:
background-clip: border-box|padding-box|content-box;
属性值:
立即学习“前端免费学习笔记(深入)”;
● border-box:背景被裁剪到边框盒,即边框以内的区域。
● padding-box:背景被裁剪到内边距框,即padding以内区域。
● content-box:背景被裁剪到内容框,即内容以内的区域。
注:Internet Explorer 8 以及更早的版本不支持 background-clip 属性。
CSS background-clip属性的使用示例
<!DOCTYPE html> <html> <head> <style> div { width:300px; height:300px; padding:50px; background-color:yellow; background-clip:content-box; border:2px solid #92b901; } </style> </head> <body> <div> 这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。 这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。 这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。 这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。 这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。 这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。 </div> </body> </html>
效果图:
以上就是本篇文章的全部内容,希望能对大家的学习有所帮助。更多精彩内容大家可以关注php中文网相关教程栏目!!!
以上就是CSS3中的background-clip属性怎么用的详细内容,更多请关注php中文网其它相关文章!
每个人都需要一台速度更快、更稳定的 PC。随着时间的推移,垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是,许多工具可以让 Windows 保持平稳运行。
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号