相关疑难解决方法(0)

如何让CSS三角形显示在一行而不是垂直

基本上,我想在页面顶部有一排三角形.他们应该面朝下.我已经在CSS中创建了三角形,但由于某种原因,他们想要在彼此之上上下,而不是像我一样需要它们.

有没有CSS经验的人可以看看吗?谢谢.

HTML:

<div class="triangle-container">

    <div class="arrow-down">
    </div>

    <div class="arrow-down">
    </div>

</div>
Run Code Online (Sandbox Code Playgroud)

CSS:

/* BODY */

body
{
    background-color: #eee;
    height: 100%;
    width: 100%;
    z-index: 1;
    padding: none;
    border: none;
    margin: none;
}

/* Triangles! */

.triangle-container
{
    display: inline;
    height: auto;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    text-align: center;
}

.arrow-down
{
    margin-left:auto;
    margin-right:auto;
    width:0;
    height:0;
    border-left:50px solid transparent;
    border-right:50px solid transparent;
    border-top:50px solid #FF6A00;
}
Run Code Online (Sandbox Code Playgroud)

jsFiddle演示

html css

0
推荐指数
1
解决办法
1361
查看次数

标签 统计

css ×1

html ×1