CSS 塊級元素并列可以使不同的 HTML 塊級元素在同一行內(nèi)呈現(xiàn)，并且每個元素占據(jù)不同的寬度。本文將簡單介紹 CSS 的塊級元素并列屬性。

要實現(xiàn) CSS 的塊級元素并列，你需要聲明一個父元素，這個父元素需要使用 CSS 屬性 display: flex。這是因為 CSS3 引入了 Flexbox 布局，它可以輕松地實現(xiàn)元素并列布局。

.parent {
display: flex;
}

然后，你需要在父元素中聲明每個希望并排顯示的 HTML 元素的樣式，這些元素被稱為 Flex 子元素。默認(rèn)情況下，它們會平均地占據(jù)可用的空間，但是你可以通過設(shè)置 width 屬性來定義它們的寬度。如果你不希望元素平均占據(jù)空間，則可以使用 flex-grow 屬性。

.parent {
display: flex;
}
.child {
width: 50%;
}

如果你希望任何余下的空間通過縮小元素來填充，則可以使用 flex-shrink 屬性。同樣，如果你希望元素在空間不足時擴(kuò)展，則可以使用 flex-grow 屬性。

.parent {
display: flex;
}
.child {
flex-grow: 1;
flex-shrink: 1;
}

最后，你還可以使用 justify-content 和 align-items 屬性來定義 Flex 子元素的位置。justify-content 屬性用于水平布局，而 align-items 屬性用于垂直布局。

.parent {
display: flex;
justify-content: space-between;
align-items: center;
}

總之，CSS 塊級元素并列是一種靈活、方便的布局方式。通過使用 Flexbox 布局，你可以輕松地定制并排顯示的 HTML 元素的樣式，從而實現(xiàn)精美的 UI。