PHP実戦20日目_PHPチュートリアル

厳密に言うと、最近の実践はdiv+cssとpsの実践です

CSS は同じ属性で行き来します。

[CSS]
@charset "utf-8"; 
/* CSS ドキュメント
*{
    マージン:0px; 
    パディング:0px; 
    フォントサイズ:14px; 
    }
体{
        背景色:#ECECEC; 
    }
 
#頭{
    位置:固定; 
    上:0px; 
     
    背景:#FAFAFA; 
     
    幅:100%; 
    高さ:54ピクセル; 
     
    ボーダーボトム: 1px ソリッド #E8E8E8; 
    ボックスシャドウ: 0 1px 5px rgba(34, 25, 25, 0.2); 
    z インデックス:100; 
     
}
 
#ヘッダー{
    マージン:0 自動; 
 
    幅:960ピクセル; 
    高さ:54ピクセル; 
    }
.nav{
    フロート: 左; 
    高さ: 54ピクセル; 
    幅: 自動; 
    }
     
.nav ul 、.nav li{
    フロート: 左; 
    list-style: 外側にはなし。 
}
 
.nav lia{
    パディング: 0 15px; 
     
    色: #585858; 
    表示ブロック; 
    行の高さ: 54px; 
     
    ボーダー右: 1px ソリッド #E8E8E8; 
}
 
 
#メイン{
 
    位置:相対; 
    上:82ピクセル; 
     
    マージン:0 自動; 
 
    幅:960ピクセル; 
    高さ: 自動; 
    }
 
#左{
    フロート: 左; 
 
    背景: なし スクロールを繰り返す 0 0 #FFFFFF; 
    境界線: 1 ピクセルの実線 #C7C7C7; 
    幅: 630ピクセル; 
 
    
}
 
#そうですね{
    フロート:右; 
 
    //背景: なし繰り返しスクロール 0 0 #FFFFFF; 
   // 境界線: 1px 実線 #C7C7C7; 
    幅: 314ピクセル; 
 
     
}
 
 
 
#フッター{
    フロート: 左; 
 
    マージントップ:90px; 
 
    ボーダートップ: 実線 1px #ccc; 
 
    幅: 100%; 
 
 
}
 
#f_center{
    幅: 960ピクセル; 
    高さ: 54ピクセル; 
    マージン: 0 自動; 
 
    テキスト整列: 中央; 
 
}
 
#f_top{
 
    幅:700ピクセル; 
    マージン: 0 自動; 
    マージントップ: 10px; 
}
 
#f_top ul{
    リストスタイル: なし; 
}
 
#f_トップリ{
    フロート: 左; 
    パディング: 10px; 
    ボーダー右: 実線 1px #ccc; 
}
 
#f_bottom{
    フロート: 左; 
    テキスト整列: 中央; 
    幅: 960ピクセル; 
 
}
 
.left_kuai{
    パディング左: 10px; 
    パディングボトム:10px; 
}
 
.left_kuai_t{
    背景画像:url("../img/item_left.png"); 
    幅: 412ピクセル; 
    高さ:65ピクセル; 
 
    マージントップ:20px; 
    マージン左: -19px; 
 
    色: #FFFFFF; 
    フォントの太さ: 700; 
    高さ: 65ピクセル; 
    行の高さ: 55px; 
 
    テキストインデント: 2em; 
}
 
.right_kuai{
    マージントップ:0px; 
    マージン-ボトム: 20px; 
    幅:100%; 
    境界線: 実線 1px #ccc; 
    背景色: #fff; 
 
    パディング左: 10px; 
    パディングボトム:10px; 
 
}
 
.right_kuai_t{
    背景画像:url("../img/item_right.png"); 
    幅: 166ピクセル; 
    高さ: 30ピクセル; 
 
    マージントップ:-12px; 
    マージン左:20px; 
 
    色: #FFFFFF; 
    フォントサイズ: 15px; 
    フォントの太さ: 700; 
    行の高さ: 30px; 
 
    テキストインデント: 1em; 
 
}

@charset "utf-8";
/* CSS ドキュメント 微凉 QQ:496928838 http://wl.125.la*/
*{
 マージン:0px;
 パディング:0px;
 フォントサイズ:14px;
 }
体{
  背景色:#ECECEC;
 }

#頭{
 位置:固定;
 トップ:0px;
 
 背景:#FAFAFA;
 
 幅:100%;
 高さ:54px;
 
 border-bottom: 1px ソリッド #E8E8E8;
 ボックスシャドウ: 0 1px 5px rgba(34, 25, 25, 0.2);
 z-インデックス:100;
 
}

#ヘッダー{
 マージン:0 自動;

幅:960ピクセル;
 高さ:54px;
 }
.nav{
 フロート: 左;
    高さ: 54px;
    幅: 自動;
 }
 
.nav ul 、.nav li{
 フロート: 左;
    list-style: 外側にはなし;
}

.ナビリア{
    パディング: 0 15px;
   
    色: #585858;
    表示: ブロック;
    行の高さ: 54px;
 
 ボーダー右: 1 ピクセルの実線 #E8E8E8;
}

#メイン{

位置:相対;
 トップ:82px;
 
 マージン:0 自動;

幅:960ピクセル;
 高さ: 自動;
 }

#左{
 フロート: 左;

背景: なし繰り返しスクロール 0 0 #FFFFFF;
    境界線: 1 ピクセルの実線 #C7C7C7;
    幅: 630px;

}

#そうです{
 フロート:右;

//背景: なし繰り返しスクロール 0 0 #FFFFFF;
   // 境界線: 1px の実線 #C7C7C7;
    幅: 314px;

}

#フッター{
 フロート: 左;

margin-top:90px;

ボーダートップ: 実線 1px #ccc;

幅: 100%;

}

#f_center{
 幅: 960px;
 高さ: 54px;
 マージン: 0 自動;

text-align: center;

}

#f_top{

幅:700ピクセル;
 マージン: 0 自動;
 マージントップ: 10px;
}

#f_top ul{
 リストスタイル: なし;
}

#f_トップリ{
 フロート: 左;
 パディング: 10px;
 ボーダー右: 実線 1px #ccc;
}

#f_bottom{
 フロート: 左;
 text-align: 中央;
 幅: 960px;

}

.left_kuai{
 パディング左: 10px;
 パディングボトム:10px;
}

.left_kuai_t{
 背景画像:url("../img/item_left.png");
 幅: 412px;
 高さ:65px;

margin-top:20px;
 マージン左: -19px;

カラー: #FFFFFF;
    フォントの太さ: 700;
    高さ: 65px;
    行の高さ: 55px;

テキストインデント: 2em;
}

.right_kuai{
 margin-top:0px;
 margin-bottom: 20px;
 幅:100%;
 境界線: 実線 1px #ccc;
 背景色: #fff;

padding-left: 10px;
 パディングボトム:10px;

}

.right_kuai_t{
 背景画像:url("../img/item_right.png");
 幅: 166px;
 高さ: 30px;

margin-top:-12px;
 margin-left:20px;

色: #FFFFFF;
    フォントサイズ: 15px;
    フォントの太さ: 700;
    行の高さ: 30px;

テキストインデント: 1em;

}