设置边框厚度需使用border-width属性，可统一或单独设定四边宽度，常用像素值如5px；支持上右下左顺时针写法，如2px 4px 6px 8px；也可简写为上下、左右或上、左右、下三种格式；若仅设置单边，可用border-top-width等属性；注意border-width必须配合border-style使用，否则边框不显示，推荐与border-color一并设置，或直接使用border简写属性如2px solid #000。
通过CSS设置元素边框厚度，使用 border-width 属性即可。它可以单独设置四条边的宽度，也可以统一设置。
1. 使用 border-width 设置边框厚度
border-width 接受长度值（如 px、em）或关键词（如 thin、medium、thick）。不推荐使用关键词，因为不同浏览器显示可能不一致。
常见写法示例：border-width: 5px; — 四条边均为5px border-width: 2px 4px 6px 8px; — 上右下左（顺时针） border-width: 3px 6px; — 上下为3px，左右为6px border-width: 1px 2px 3px; — 上=1px，左右=2px，下=3px
2. 分别设置单一边框宽度
如果只想修改某一条边，可以使用以下属性：
border-top-width: 10px; border-right-width: 5px; border-bottom-width: 3px; border-left-width: 7px;
3. 结合 border-style 和 border-color 使用
border-width 单独设置无效，必须配合边框样式（border-style）使用，否则边框不会显示。
Reclaim.ai
为优先事项创建完美的时间表
90 查看详情
立即学习“前端免费学习笔记（深入）”；
完整示例：
div { border-width: 2px; border-style: solid; border-color: #000;}
或者简写为：
div { border: 2px solid #000;}
基本上就这些。只要记住设置宽度前要先定义样式，就能正常显示边框了。
以上就是如何通过css设置元素边框厚度border-width的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/998339.html
微信扫一扫 
支付宝扫一扫 
