css 向左向下箭头

html-css021

css 向左向下箭头,第1张

使用

当然,其他任意方向也是可以的,只需要控制旋转角度rotate即可。原理是构造了一个正方形,隐藏了其中的两条边left和bottom,然后进行旋转。

通过使用正方形左下两条边,并向下向右平移,再旋转,得到一个向下并居中的箭头

① 可以使用“相对定位”,position:relative;

② 注意坐标轴的移动方向:

向左移动:当然是正数->left:50px

向下移动:当然是正数->top:50px;

(这样记:既然要向下移动,当然是要远离top顶部了,自然top的属性值要正数

既然要向右移动,就是远离左边了,left属性值自然要为正数!!!)