DIV CSS边框有哪些效果？CSS边框效果有哪些样式？

1、div css边框有哪些效果？css边框效果有哪些样式？div css边框有哪些效果？css边框效果有哪些样式？首先知道边框css单词为border，其css样式值是复数值，每个值中间用法1个空格间隔。我们看看css border边框样式语法结构：对一个盒子对象设置边框样式css代码：.divcss5 border:1px solid f00 边框结构分析图修改边框样式我们可以从3方面举行修改。一、修改宽度 - top修改边框宽度值可以实现边框厚度（宽度）效果。1：当边框宽度设置为1px时div+css代码 divcss5 边框样式 .divcss5 border:1px solid f00;

2、 width:180px; height:80px 效果截图：边框为1px宽度时候效果截图2：当边框宽度设置为5px时div+css代码 divcss5 边框样式 .divcss5 border:5px solid f00; width:180px; height:80px 案例效果截图边框为5px时候效果截图由以上两个更改边框宽度可以实现转变边框效果样式。二、修改边框色彩 - top修改边框色彩也可以转变边框样式效果。1、设置边框为红色html源代码+css代码： divcss5 边框样式 .divcss5 border:5px solid f00; width:180px; height:

3、80px 边框为红色效果截图2、设置边框为蓝色html源代码css代码： divcss5 边框样式 .divcss5 border:5px solid 00f; width:180px; height:80px 效果截图css+div案例之蓝色边框效果截图三、修改边框样式 - top比如实线边框、虚线边框修改css样式分析截图1、样式有哪些边框样式参数：none : 无边框。与任何指定的border-width值无关hidden : 躲藏边框。ie不支持dotted : 在mac平台上ie4+与windows和unix平台上ie5.5+为点线。否则为实线dashed : 在mac平台上ie4+

4、与windows和unix平台上ie5.5+为虚线。否则为实线solid : 实线边框double : 双线边框。两条单线与其间隔的和等于指定的border-width值groove : 按照border-color的值画3d凹槽ridge : 按照border-color的值画菱形边框inset : 按照border-color的值画3d凹边outset : 按照border-color的值画3d凸边2、样式效果截图边框线条样式截图3、常用与需要注重如何挑选边框常用共3个属性：3-1：none : 无边框。3-2：dashed 虚线3-3：solid 实体线其它边框线条样式兼容扫瞄器不是那么

5、好，所以平常大家挑选用法时候注重用法这3个即可。dashed虚线和solid实体线以上实例均演示为实现，接下来我们看看虚线边框样式：虚线边框css div实例代码： divcss5 边框样式 .divcss5 border:5px dashed 00f; width:180px; height:80px 效果截图：div css虚线边框实例效果截图总结：转变边框样式可以从边框宽度、边框色彩、边框线条样式转变。与边框相关css教程文章：1、div加边框border2、div显示边框3、html虚线边框4、css虚线边框5、css虚线下划线6、div css边框宽度7、css去掉img边框8、css设置html表格边框9、css边框缩写10、css边框样式代