DIV+CSS_html/css_WEB-ITnoseの6つのポイント

WBOY
リリース: 2016-06-24 12:33:08
オリジナル
1088 人が閲覧しました

DIV+CSS は初めてですか?注意が必要な質問が 6 つあります。 DIV+CSS の初心者として、コードを記述する前に Web ページの全体的な構造を明確に理解していれば、半分の労力で 2 倍の結果が得られます。ただし、執筆プロセス中には常に何らかの問題が発生するため、立ち止まって情報を探したり、属性の定義を明確にしたりする必要があります。
実際、DIC+CSS をより深く理解しながら効率を向上させる方法はたくさんあります。以下にいくつかの点を示します。

1. CSS 命名規則:

1. ファイル命名規則
グローバル スタイル: global.css;
フォント スタイル: font.css;
リンク スタイル: link . css;
印刷スタイル: print.css;
2. 共通のクラス/ID 命名規則
ヘッダー: ヘッダー
コンテンツ: コンテナー
フッター: フッター
著作権: copyright
ナビゲーション: メニュー
メイン ナビゲーション: mainMenuサブナビゲーション:subMenu
ロゴ:logo
スローガン:banner
タイトル:title
サイドバー:sidebar
アイコン:アイコン
注記:note
検索:search
ボタン:btn
ログイン:login
リンク:リンク
情報ボックス:manage
……

2. ブラウザの BUG 問題への対処
この点に関しては、あの専門家が CSS BUG をジングルにしたのかな!ここに引用すると覚えやすいです!
1. IE の境界線が境界線がないように見える場合は、高さの設定が忘れられている可能性があることに注意してください。

2. フロートが生成されるのには理由があります。親レイヤーがフロートを含めたい場合は、フロートを含めます。すぐにクリアする必要があります。コンテナはその中に自然に表示されます。 3. ピクセル テキストの動きが遅い場合でもパニックにならないでください。高さの設定が役に立ちます。 4. デフォルトはすべてのブラウザーと互換性があることに注意してください。行の高さの設定はキラーになる可能性があります。

5. フローティングを個別に解除し、行の高さをなしに設定し、高さをゼロに設定することを忘れないでください。これにより、デザイン効果が向上します。
6. レイアウトの学習には思考が必要です。自然で直線的なレイアウト原則、制御しやすい HTML、ハッキングの少ない合理化されたレイアウト、クリーンなコード、優れた互換性、フレンドリーなエンジンが歓迎されます。

3. すべてのタグがアクティブです
デフォルトが異なるだけです。Span は Wji です。Wji はインラインとブロック レベルの 2 つのインストゥルメントを生成します。img はより特殊ですが、法的原則にも準拠しています。その他は単に異なる変更です。 、1 つの * 記号はすべてを返します。すべてが規則的であるため、カスケード スタイルにはさらに練習が必要であることがわかりました。

4. 画像リンクのレイアウトに注意してください
画像リンクのテキストリンクを揃える場合は、多少の違いでも問題ありませんので、padding とvertical-align:middle を設定する必要があります。

5. IE フローティング二重マージン
表示: インラインを使用してください。そして造花メーカー

6. リストの水平レイアウト
リストのコードは互いに近くなければならず、ギャップは記憶されなければなりません。

DIC+CSS の学習は長い道のりであり、それを本当に続けるには敬虔な新しい心を持たなければなりません。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート