javaの-day27

ブートストラップ##：
    1.コンセプト：Twitterからフロントエンドの開発フレームワーク、ブートストラップは、現在、非常に人気のフロントエンドのフレームワークです。ブートストラップは、HTML、CSS、JavaScriptをベースとし、それは、そのWeb開発者ので、より迅速に、簡単で柔軟性があります。
        *フレーム：半完成ソフトウェアは、開発者がコーディング簡素化し、開発中に、基礎フレームすることができます。
        *利点：
            1. JSとCSSスタイルのプラグインの多くを定義します。私たちの開発者は、これらのスタイルを使用することができますし、エフェクトプラグインが豊富なページを取得します。
            2.応答レイアウト。
                *異なる解像度の互換デバイスとのページ。

    2.クイックスタート
        1.ダウンロードブートストラップ
        フォルダこれら三つのプロジェクト2.
        3.は、必要なリソースファイルの導入をHTMLページを作成します

        。<！DOCTYPE HTML>
        <HTML LANG = "ZH-CN">
        <HEAD>
            <文字セット=メタ"UTF-8">
            <META HTTP-当量= "X - UA互換"コンテンツ= "のIE =エッジ">
            <メタ名=「ビューポート」コンテンツ=「幅=幅デバイス、初期スケール= 1。」>
            <！ - * 3つのメタタグが上に配置する必要があります*、他のコンテンツ* *その後に続くべき！- >
            <タイトル>ブートストラップのHelloWorld </ TITLE>

            <！ -ブートストラップ- >
            <リンクのhref = "CSS / bootstrap.min.css"のrel = "スタイルシート">


            <！ -ブートストラップのすべてのためのjQueryの（JavaScriptのプラグインjQueryのに依存している、それが前に置かれなければならない） - >
            <スクリプトSRC = "JS / jQueryの-3.2.1.min.js"> </ SCRIPT>
            <！ -すべてのブートストラップのJavaScriptのプラグインのロード。あなたはまた、唯一の1つのプラグインに必要なを読み込むことができます。- >
            <SCRIPT SRC = "JS / bootstrap.min.js"> </ SCRIPT>
        </ HEAD>
        <BODY>
        <H1>こんにちは、世界！</ H1の>

        </ BODY>
        </ HTML>

##応答レイアウト
    *異なる解像度の互換デバイスとのページ。
    *達成：システムは、グリッドに依存：グリッド線が均等に指定することができるいくつかのグリッド要素を表す、12に分割されている
    *手順を：
        1.コンテナを定義します。上記の表に対応する、
            *容器の分類：
                1.コンテナ：ブランクの両側に
                2コンテナ流体は、各デバイスは、幅の100％で
        2定義される行。同等のtrスタイル前：行
        3.要素を定義しました。異なるデバイスで指定された要素、占有格子の数。スタイル：col-機器コード-格子の数
            *コード機器：
                1. XS：超小型の携帯電話の画面（<768px）：COL-XS-12は、
                小さなスクリーン版（≥768px）：2. SM
                3. MD：中画面デスクトップモニタ（≥992px）
                4. LG：大画面大型デスクトップモニタ（≥1200px）

        *注：
            1.グリッド線の数が12を超える場合、過剰ラップ。
            2.ラスター上位互換クラス属性。クラスは、より広い幅のスクリーングリッドに使用またはカットオフポイントデバイスのサイズに等しいです。
            3.実際の幅は、デバイスクラスの最小値よりも小さい場合には、要素は行全体でカバーされる、ラスタデバイスコードを属性。

## CSSスタイルとJS、プラグイン
    のグローバルCSSスタイルを：
        *ボタン：クラス= "BTN BTN-デフォルト"
        *画像：
            *クラス= "IMG応答性"：任意のサイズの画像が100％
            *画像の形状
                * <IMG SRC = "..." ALT = " ..."クラス= "IMG-丸い">：スクエア
                * <IMG SRC = "..." ALT = "..."クラス= "IMG-サークル">：円形
                * <IMG SRC = "..." ALT = "..."クラス= "IMG-サムネイル">：フレーム
        *表
            *表
            *表接さ
            *表hover-
        *形
            *アイテムテーブルに追加：クラス= "

    3.プラグ：
        *カルーセル図

おすすめ