用CSS绘制简单图形
2021-06-06 16:04
阅读：639
标签：设置 宽度 trick 矩形 使用 css nbsp order example 这里有篇文章， https://css-tricks.com/examples/ShapesOfCSS/ ，介绍了如何用只用1个元素和CSS规则绘制各种常见的图形： 从简单的矩形、三角形到复杂的月亮、放大镜甚至是太极图。 用CSS绘制简单图形 标签：设置 宽度 trick 矩形 使用 css nbsp order example 原文地址：http://www.cnblogs.com/a-distant-bright-star/p/7337305.html
这种绘图方式主要用到了两类技巧： 一是使用伪元素， 二是设置图形的边框。
特别是边框的使用，非常巧妙。从这些例子中可以发现：当元素的宽、高设置为0时，浏览器仍然会渲染元素的边框（即便box-sizing设置为了border-box，这时实际的宽/高会是边框的厚度之和）,巧妙设置4条边框的宽度，就可以做出很多奇妙的效果。
下一篇：HTML常用操作
评论
亲，登录后才可以留言！