本文详细介绍了CSS中border属性的使用，包括可能的边框宽度、样式（实线、虚线、点线）和颜色设置。通过示例展示了如何使用border-left、border-right、border-top和border-bottom属性分别设置各边边框，并通过不同颜色和样式的组合创建各种效果。同时，探讨了透明边框的应用及其在设计中的作用。
border用法详解：
可能的值：像素
可能的值：solid(直线)，dashed(虚线)，dotted(点线)
可能的值：red,#f00,#ff0000,rgb(255,0,0),transparent
border-left 属性设置左边框
border-right 属性设置右边框
border-top 属性设置上边框
border-bottom 属性设置下边框
扩展延伸
html代码
css代码p {
height: 20px;
width: 20px;
border-color: #FF9600 #3366ff #12ad2a #f0ed7a;
border-style: solid;
border-width: 20px;
}
结果
css代码p {
width: 0px;
height: 0px;
border-color: #FF9600 #3366ff #12ad2a #f0ed7a;
border-style: solid;
border-width: 20px;
}
结果
css代码p {
width: 0px;
height: 0px;
border-color: lightblue transparent trnasparent transparent;
border-style: solid;
border-width: 20px;
}
结果
css代码p {
width: 0px;
height: 0px;
border-color: transparent trnasparent pink;
border-style: solid;
border-width: 20px;
}
结果
css代码p {
width: 0px;
height: 0px;
border-color: transparent gray trnasparent transparent;
border-style: solid;
border-width: 20px;
}
结果
css代码p {
width: 0px;
height: 0px;
border-color: transparent transparent trnasparent lightgreen;
border-style: solid;
border-width: 20px;
}
结果
扫一扫
519
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
