怎么用css控制border成为三角形

html-css026

怎么用css控制border成为三角形,第1张

用css控制border成为三角形可以参考以下的代码:

.a {width:0height:0border-left:50px solid transparentborder-right:50px solid transparentborder-bottom:100px solid red}

扩展资料:

border的css应用

如使用该复合属性定义其单个参数,则其他参数的默认值将无条件覆盖各自对应的单个属性设置。

默认值为:medium none。border-color的默认值将采用文本颜色。

提示和注释

注释:HTML 4.01 不推荐使用图像的 "border" 属性。在 XHTML 1.0 Strict DTD 和 HTML 5 中,不再支持该属性。

提示:请使用 CSS 的边框属性来改变元素的边框样式。您可以在一个外部样式表中使用 CSS 边框属性,为站点上的所有图像设置一致的边框。与单独为一个图像设置 border 属性相比,这种方式无疑拥有更高的效率。

参考资料来源:百度百科-border (英文单词)

圆角边框:border-radius: 8px(8px代表的是圆角弧度,可以根据自己的需要调整,需要注意的是这个属性的兼容性,在IE8以下的浏览器是不兼容的,也就是说,没效果)\x0d\x0a\x0d\x0a阴影:box-shadow:x y z color(比如:box-shadow: 0px 0 13px rgba(100,100,100,.7)x代表的是水平方向的偏移,y代表的是纵向偏移,z代表的是扩散,color就是阴影颜色了,表现方式有2种,1.就是#ccc[十六进制]2.rgba[或者rgb]\x0d\x0a)\x0d\x0a\x0d\x0a这两个样式都是css3样式,所以在低版本的IE上面都是不兼容的。