先来一波常规QAQ吧
新手入门级别都是先画一亩三分地,打下一个带有宽高的江山图,看下面
代码如下:简单 低调 奢华 有效果
没错,这就是我们常规操作,5个像素的边框宽度大小,solide实线边框样式,black黑色边框颜色
再来一波非常规的操作
不需要奢华 只需要简单 以及更低调的操作
代码如下:
没有边框打下,也没有颜色,这不符合逻辑呀,那~结果为啥子是这样的?
深度解析
其实,这一切的一切都是有原因的,因为这里暗含操作border:medium solid black;
medium 代表边框的默认宽度,这里默认是多少呢?大家不妨先猜一猜
solide 就不说了
black 默认边框颜色,为什么又是默认黑色呢?再猜一下
问题一:border:3px;只是它可以生效么?
然而丝毫没有动摇
问题二:border:black;只是它可以生效么?
骗子,都是骗子,这两个没有效果、、、
问题三:为什么是三个像素,为什么是黑色?
到了放大招的时候了:
现在明白了么?这里的双线每一根的大小是一个像素,中间间隔在一个像素,加起来就是三个像素啦,为了更好的和实线呼应,实线就是三个像素啦^v^
你以为这就完了么,这个大招是持续性的:
这个颜色,怎么绿了,不是字体颜色么?现在明白了么?
边框颜色默认渲染字体颜色,字体颜色默认渲染是黑色的,所以这里就理所当然的渲染过来啦。
欢迎同学们跟我一起深入探讨你所不知道的前端哦,赶紧加入我们吧