page contents

css盒子模型属性有哪些?

本篇文章给大家带来的内容是关于css的盒子模型属性有哪些?css盒子模型相关属性的介绍,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。

attachments-2021-07-hr2m265k61020fbfd5740.jpg

本篇文章给大家带来的内容是关于css的盒子模型属性有哪些?css盒子模型相关属性的介绍,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。

1、盒子模型图

attachments-2021-07-PjLp166P61020ed8c4e49.jpg2、一个简单的盒子模型 
box.html

attachments-2021-07-d5FY8UhY61020ef1e5356.jpg
3、css盒子模型相关属性之width/height是指内容的宽度和高度

box.css

attachments-2021-07-CbCfxVr661020f10e627a.jpg4、css盒子模型相关属性之边框(宽度,样式,颜色) 
border: px style color; 
border-top: px style color;

宽度:border-width;单个边框:border-top-width;

box.css

attachments-2021-07-KzFeUYEE61020f3c45164.jpg样式:border-style 
属性值:dotted(点) 
dashed(虚线) 
solid(实线) 
double(双线)

box.css

attachments-2021-07-M30NjOHZ61020f43d74ac.jpg5、css盒子模型相关属性之内边距–padding 
设置单个方向:padding-top/padding-bottom/padding-left/padding-right

box.css

attachments-2021-07-SLYZdQkj61020f597fd12.jpg
6、css盒子模型相关属性之外边距-margin 
设置单个方向:margin-top/margin-bottom/margin-left/margin-right 
box.css

attachments-2021-07-aEB4xcxI61020f71c3bc6.jpg
7、css盒子模型相关属性之轮廓:作用在border之外的样式 
outline-width 
outline-style: 
hidden(隐藏) 
dotted(点) 
dashed(虚线) 
solid(实线) 
double(双线) 
outline-color: 
或者: 
outline: px style color;

更多相关技术内容咨询欢迎前往并持续关注六星社区了解详情。

程序员编程交流QQ群:805358732


如果你想用Python开辟副业赚钱,但不熟悉爬虫与反爬虫技术,没有接单途径,也缺乏兼职经验
关注下方微信公众号:Python编程学习圈,获取价值999元全套Python入门到进阶的学习资料以及教程,还有Python技术交流群一起交流学习哦。

attachments-2022-06-8dQ2LFGm62ad67e45026f.jpeg

你可能感兴趣的文章

相关问题

0 条评论

请先 登录 后评论
轩辕小不懂
轩辕小不懂

2403 篇文章

作家榜 »

  1. 轩辕小不懂 2403 文章
  2. Pack 1131 文章
  3. 小柒 1038 文章
  4. Nen 576 文章
  5. 王昭君 209 文章
  6. 文双 71 文章
  7. 小威 64 文章
  8. Cara 36 文章