瞭解一些WP主題CSS代碼

這是文件的style.css在WordPress主題二16的提取物。我有這部分代碼在頁面的頂部和底部創建一個黑色條。瞭解一些WP主題CSS代碼

body:not(.custom-background-image):before, 
body:not(.custom-background-image):after { 
    background: inherit; 
    content: ""; 
    display: block; 
    height: 21px; 
    left: 0; 
    position: fixed; 
    width: 100%; 
    z-index: 99; 
}

我肯定這個原因，我明白，修改高度0px我讓帶消失。但是，這些說明如何工作來創建兩個條帶？我知道這也是一個完整的CSS工作，但我認爲這些說明是工作的重要組成部分。

主題的預覽是在這裏： https://wordpress.org/themes/twentysixteen/。

整個的style.css文件是在這裏： https://github.com/WordPress/twentysixteen/blob/master/style.css#L18-L51

誰能幫我清理東西呢？

來源

2016-01-04 Artemide Innominato

:before和:after是僞選擇。有了這個，你可以設計元素之前/之後發生的事情。

Background: inherit;將繼承從本體元件的背景。

注意，也有margin: 21px上.page

來源

2016-01-04 10:09:21 yeouuu

我的觀點是要了解你在哪裏的兩條從何而來。我在聲明之前和之後都知道，我已經看到.page類中設置的邊距。如果我將該邊距設置爲0px，也會顯示條。關於爲什麼這些說明創建兩個條紋的霧仍然存在。 –

那麼這些條就完全來自它。前後有21px的高度。並有黑暗的顏色。 – yeouuu

爲什麼我有兩條而不只一條？爲什麼它們以對稱的位置貼在頁面的頂部和底部？我可以看到一個「left：0」，我想這會將條設置在左側位置，但是「top：0」位置（或底部對稱）的設置位置在哪裏？我需要這個問題的答案... –

瞭解一些WP主題CSS代碼

回答

相關問題