ホームページ  >  記事  >  ウェブフロントエンド  >  標準パーツを使用して Web ページの DIV レイアウトを組み立てる - WEB 標準 Web サイトのデザイン体験_CSS/HTML

標準パーツを使用して Web ページの DIV レイアウトを組み立てる - WEB 標準 Web サイトのデザイン体験_CSS/HTML

WBOY
WBOYオリジナル
2016-05-16 12:10:511815ブラウズ

このようなアイデアはあるが、実現可能かどうかはわからない

例:
レイアウトの左の列の属性は次のとおりです: {左、幅、背景色、フォントなど}
各属性を標準パーツ化し、このように組み立てて使用すると
class="float width height background font padding...."、複数のクラスの標準部分を参照してページ レイアウト スタイルを完成させます
まず、必要に応じて次のような標準パーツを定義します。

フロート標準パーツ
.l{float:left}
.r{float:right}
.cl{クリア:左}
...

幅標準部品
.w200{幅:200px}
.w300{幅:300px}
...

背景標準パーツ
.red{背景:赤}
.black{背景:#000}
.white{背景:#fff}
...
必要に応じて引用
class="l w200 red"[左、幅200、背景赤]
class="r w200 白" [右、幅 200、背景白]

現在、独自のコードを記述し、最大 2 つのクラスでレイアウト スタイルを定義できるため、非常に便利です

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。