Question

我希望在一行中有三个三角形，其中第一个和第三个指向上方，中间一个指向下方。现在，第一和第三（低三角形）没问题，我遇到中间问题。

为什么上三角的大小如此之小？

除此之外我怎么能有这样的安排？

＆＃13;

.lower {
  border-width: 50px;
  border-color: black red green blue;
  border-style: solid;
}

.upper {
  border-width: 50px 50px 0 50px;
  border-color: black transparent transparent transparent;
  border-style: solid;
  height: 50px;
}

＆＃13;

<div class="triangles">
  <span class="lower"></span>
  <span class="upper"></span>
  <span class="lower"></span>
</div>

＆＃13;

Answer 1

众所周知，span是一个内联元素，所以你必须使它成为一个内联块元素来获取span的实际空间。只需添加

No_Exception_Propagation

在CSS中

。边界宽度问题将被修复（Y）。

Answer 2

这是答案的一部分;另一种方式。我仍然不知道为什么或如何发生。

＆＃13;

.lower,
.upper {
  border-style: solid;
  display: inline-block;
}

.lower {
  border-width: 0 50px 50px 50px;
  border-color: transparent transparent black transparent;
}

.upper {
  border-width: 50px 50px 0 50px;
  border-color: black transparent transparent transparent;
}

＆＃13;

<div class="triangles">
  <span class="lower"></span>
  <span class="upper"></span>
  <span class="lower"></span>
</div>

＆＃13;

Answer 3

我认为这是由于

中的0

border-width: 50px 50px 0 50px;

Answer 4

<application
    android:allowBackup="true"
    android:icon="@mipmap/ic_launcher"
    android:label="@string/app_name"
    android:supportsRtl="true"
    android:theme="@style/AppTheme">
    <activity android:name=".MainActivity">
        <intent-filter>
            <action android:name="android.intent.action.MAIN"/>
            <category android:name="android.intent.category.LAUNCHER"/>
        </intent-filter>
    </activity>

    <activity android:name=".EditorActivity"
              android:exported="true">
        <intent-filter>
            <action android:name="android.intent.action.EDIT"/>
            <data android:mimeType="image/*"/>
            <category android:name="android.intent.category.DEFAULT"/>
        </intent-filter>
    </activity>
</application>

为什么我的顶部边框小于底部？

4 个答案: