99国产欧美久久久精品蜜臀|精品无码久久久久久久久久|亚洲国产日韩欧美一区综合|国产亚洲欧洲综合5388

<track id="jjz3x"></track>

            <menuitem id="jjz3x"><dfn id="jjz3x"><thead id="jjz3x"></thead></dfn></menuitem><bdo id="jjz3x"><optgroup id="jjz3x"></optgroup></bdo><track id="jjz3x"></track>
            <nobr id="jjz3x"><optgroup id="jjz3x"></optgroup></nobr>
          1. 咨詢電話:
            15628812133
            04
            2023/11

            Less——嵌套與繼承

            發布時間:2023-11-04 17:03:41
            發布者:MaiMai
            瀏覽量:
            0

            相比于傳統的css,LESS增加了幾個核心功能,如變量、混合、函數等,讓頁面的樣式動態起來了。上一章介紹了LESS中函數的使用和規范,本章來介紹一下LESS的嵌套與繼承。

            一,嵌套

            Less 提供了使用嵌套代替層疊或與層疊結合使用的能力。我們之前選擇器層疊使用如圖所示:

            傳統css選擇器層疊

            結構復雜且冗余,編寫起來十分不方便,而Less的嵌套寫法如圖:

            less嵌套寫法

            用 Less 書寫的代碼更加簡潔,并且結構上更符合 HTML 的組織結構。

            在嵌套規則中, & 表示父選擇器,常用于給現有選擇器添加偽類。如圖:

            用&表示父選擇器

            編譯后的代碼為

            .fanhui img {margin-right : 9px;}


            二,繼承

            繼承可讓多個選擇器應用同一組屬性,最終編譯為并集選擇器。其性能比混合高,但靈活性比混合低。

            繼承

            編譯后的代碼為:

            ul li {

              background: blue;

            }

            .red,

            ul li {

              color: red;

            }

            關鍵詞:
            返回列表

            <track id="jjz3x"></track>

                      <menuitem id="jjz3x"><dfn id="jjz3x"><thead id="jjz3x"></thead></dfn></menuitem><bdo id="jjz3x"><optgroup id="jjz3x"></optgroup></bdo><track id="jjz3x"></track>
                      <nobr id="jjz3x"><optgroup id="jjz3x"></optgroup></nobr>