コミュニティ
学ぶ
ツールライブラリ
AIツール
レジャー
検索
日本語
ホームページ > ウェブフロントエンド > htmlチュートリアル > 学習メモ(5): DIV+CSSクラシックボックスモデルaccumulation_html/css_WEB-ITnose

学習メモ(5): DIV+CSSクラシックボックスモデルaccumulation_html/css_WEB-ITnose

WBOY
リリース： 2016-06-24 12:27:27
オリジナル
1035 人が閲覧しました

ボックスモデルの効果:

faceulの幅を調整し、各行の数を調整し、div1のマージン値を調整し、全体の位置を変更できます。これは非常に便利なレイアウトですモード

== ============================================= ===== =======

html コード:




< /head>


    & lt; li & gt; & lt; img src = "1.jpg"/& gt; & lt;/li & gt ;
    & lt; & lt; IMG src = "1.jpg" "/>
    ;/li>

    ;
    < ;li>
    ;img src="1.jpg"/>
    div>



    ======== ============================ ==============

    CSS コード:

    * {
    margin:0px;
    padding:0px;
    }

    .div1{

    width:500px;

    height:300px;

    border:1px ソリッドグレー;

    }


    .faceul{
    width:420px;
    height:250px ;
    border:1px 赤一色;
    }

    .faceul li{
    list-style-type:none;

    float: left;

    幅:70px;
    高さ:50px;
    border:1px 赤一色;
    margin- left:5px;
    margin-top:5px;

    }


    .faceul img{
    width:60px;
    height:40px ;
    margin-left:5px;
    margin-top:5px;
    }


関連ラベル：
学习笔记(5)：DIV+CSS 经典盒子模型 积累
ソース：php.cn
前の記事：IE6 で div+css Web ページが空白で表示される問題の解決策??charset_html/css_WEB-ITnose 次の記事：[DIV+CSSを学ぶ] 1. 知っておくべき3つのこと_html/css_WEB-ITnose
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
最新の問題
function_exists() はカスタム関数を決定できません Function test () {return true;} if (function_exists ('test')) {echo "テストは関数です";
から 2024-04-29 11:01:01
0
3
2505
Google Chromeのモバイル版を表示する方法 こんにちは、先生、Google Chrome をモバイル版に変更するにはどうすればよいですか?
から 2024-04-23 00:22:19
0
11
2647
子ウィンドウは親ウィンドウを操作しますが、出力は応答しません。 最初の 2 つの文は実行可能ですが、最後の文は実装できません。
から 2024-04-19 15:37:47
0
1
2240
親ウィンドウには出力がありません document.onclick = function(){ window.opener.document.write('私は子ウィンドウの出力です');
から 2024-04-18 23:52:34
0
1
2106
CSS マインド マッピングに関するコースウェアはどこにありますか? コースウェア
から 2024-04-16 10:10:18
0
0
2207
関連トピック
詳細>
人気のおすすめ
人気のチュートリアル
詳細>
関連するチュートリアル
人気のおすすめ
最新のコース
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート