css
关注
分享
扫一扫
Homer_Simpson
已退坑...转行
展开
-
css盒模型与box-sizing属性
Chrome浏览器box-sizing默认是content-box。 以宽度为例： content-box下元素的实际总宽度=padding+content(内容的宽度)+border，此时width设置的宽度为内容的宽度 border-box下，元素的实际总宽度=padding+content(内容的宽度)+border，等于设置的width 下面两张图可以很好的说明： content-bo...原创 2019-12-12 17:44:44 · 281 阅读 · 0 评论 -
字体两边居中
前几天用到的知识，这里mark一下。 css中有一个属性：text-align-last。 可取的值有text-align-last: auto|left|right|center|justify|start|end|initial|inherit; 这里我用到了justify，可以让元素内的文本最后一行两端对齐。 效果如下图： ...原创 2018-09-27 16:54:33 · 476 阅读 · 0 评论 -
css3实现箭头效果的两种方式
具体原理不再赘述，网上有很多介绍，这里只做代码记录。 可以参考CSS三角形的实现原理及运用、用css制作空心箭头(上下左右各个方向均有)， 一、盒模型 这种方式通过盒模型设置元素边框，关键在于移动的那1px(两个三角形错位1px形成箭头)； <!DOCTYPE html> <html lang="en"> <head> <meta charset=...原创 2019-03-18 11:44:06 · 2884 阅读 · 0 评论 -
css画正六边形
<div class="hexagon"> <div class='one'>月1</div> <div class='two'>月2</div> <div class='three'>月3</div> </div> .hexagon{ position:relative;wi...原创 2019-08-29 14:01:36 · 394 阅读 · 0 评论