ULのliセンター

実際には、これは問題のレイアウト、第1のバーコードであります

<DIV CLASS = "聞いた"> 
        <UL> 
            <LI>最初のLi </ LI> 
            <LI>第二のLi </ LI> 
            <LI>第三のLi </ LI> 
            <LI>第李ます。</ li> 
            <LI>第五李ます。</ li> 
        </ ulの> 
    </ div>

.heard { 
    幅：100％。
    高さ：500pxなど。
    国境：1pxの固体赤。
} 
UL { 
    ディスプレイ：フレックス。
    フレックスフロー：行NOWRAP。
    正当化-コンテンツ：センター; 
} 
ULのLi { 
    リストスタイル：なし。
    背景：RGBA（255、255、255、1）; 
    ボーダー：1ピクセル固体RGBA（58、153、255、1）。
    テキスト整列：センター; 
    行の高さ：30px; 
    フォントサイズ：15ピクセル; 
    色：＃3a99ff。
    幅：88px; 
    高さ：33px; 
    margin-left：10pxの; 
}

　　

　　

レンダリング

 

 

 

    ここにあります

    フレックスフロー：行NOWRAP;これは（デフォルト）である要素は、例えば、ラップしない100％幅のdiv、このプロパティを設定し、自動的に50％ずつとなる幅2つのDIV。

    正当化コンテンツ：中心;要素は、スピンドル（ページ）の中央に配置されています

    これは、ボックスモデルであるコアコードであり、

 

    これは必ずしも、DIVああで、ああ中央のボタンに関係なく、いくつかのdiv、ショーセンターのような行としてDIVレイアウト、一度試み同じ理由で、ULリーに適用することが、同様の理由により、唯一最大でありますdivのプラスコアコード。以下のような：

<DIV CLASS = "聞いた"> 
        </ div> <DIV CLASS = "は、ABCD"> 
        </ div> <DIV CLASS = "ABCD"> 
    </ div> 


{.heard 
    表示：フレックス。
    フレックスフロー：行NOWRAP。
    正当化-コンテンツ：センター; 
} 

.abcd { 
    幅：100pxに。
    高さ：は50px; 
    国境：1pxの固体赤。
    margin-left：10pxの; 
}

　　

レンダリング：