css水平方向 居中,css调整背景图片位置,css画三角形

水平方向调整元素位置 

width: 300px;
margin: auto;
position: absolute;
left: 0;
right: 0;

 水平方向调整背景图片

background-position-x: -600px;//水平方向,同理垂直y也可以调整
#triangle03{
    width: 0;
    height: 0;
    border: 50px solid transparent;
    border-top: 50px solid blue;
    }
#triangle04{
    width: 0;
    height: 0;
    border: 50px solid transparent;
    border-right: 50px solid red;
    }
#triangle05{
    width: 0;
    height: 0;
    border: 50px solid transparent;
    border-bottom: 50px solid green;
    }
#triangle06{
    width: 0;
    height: 0;
    border: 50px solid transparent;
    border-left: 50px solid yellow;
    }

上面的代码就可以实现,四个不同方向的三角形了。

不同方向的四个三角形

发布了242 篇原创文章 · 获赞 13 · 访问量 1万+

猜你喜欢

转载自blog.csdn.net/qq_41813208/article/details/103639414