ホームページ  >  記事  >  ウェブフロントエンド  >  これらを学べば、DIV+CSS (transfer)_html/css_WEB-ITnose を始めることもできます。

これらを学べば、DIV+CSS (transfer)_html/css_WEB-ITnose を始めることもできます。

WBOY
WBOYオリジナル
2016-06-24 12:29:10871ブラウズ

転載元: http://www.zhukun.net/archives/361#more-361

CSS 関数は複雑で変更可能であり、ほとんどの初心者は混乱しており、制御方法がわかりません。それでは、簡単なチュートリアルを作成してみましょう。
1、テキスト コントロール クラス

font-size:12px; テキスト サイズ、通常は 12px。 14px が再び人気になっています。サイズはご自身でコントロールしてください。

color:#666; カラーコントロール、カラーパレットから自分で色を選択します。 16 進数
line-height:2em; 行の高さ、em は文字、px、パーセント、その他の単位をサポートします
text-align:center; テキストは中央に配置され、左は必要ありません、右は右です
font-weight:bold;太字
text-indent: 2em; 各段落、2 文字、よく使われるインデント

上記の CSS を使用すると、基本的に問題の 90% は解決でき、残りは自分でゆっくり勉強してください。

2、レイアウトクラス

margin:10px 10px 10px 50px; 外側のパッチ、右上下左。 0 を除き、単位である必要があり、単位は px cm などです。一般的に使用される px

padding10px 10px 10px 50px 内側パッチ、設定は外側パッチ
float:left; の共通属性と同じです。もっと試してください
width:51px; width
height:89px; height
overflow:hidden; クリアな 3 次元フロート (Firefox などのブラウザ用)、オーバーフロー クリア:両方; クリアなフラット フロート
#77543b;設定 ボーダーは1、実線、色、16進数です

各CSSの前に次のコードを記述する必要があります

*{padding:0; margin:0;} 指定しない場合は、内側のパッチと外側のパッチの両方が0 、Firefox の非互換性の問題コードの 90% を解決できます。

body{font-size:12px; background:#AC956C;} コンテンツのデフォルトのフォント サイズなどを設定します。ここで行の高さを制御することはお勧めしません。

a:link,a:visited,a:active{ color:#333; text-decoration:none; font-size:12px;}
a:hover{ color:#666; size:12px;} デフォルトのリンク属性。

li{ list-style:none;} li前のドットを削除します。

リスト

#tuijian {}

#tuijian ul { margin-left:60px;}

#tuijian ul li{ line-height:1.5em;color:#EEE4C1}

#tuijian ul li a{ color:#EEE4C1 }

リスト制御は習得するのが難しいですが、実際には簡単です。LI の間隔を制御するために外側の左パッチを使用することはお勧めできません。LI 幅制御を使用することをお勧めします。一般に、ul を空白のままにすることができます。個別に配置する場合、ナビゲーションでよく使用されるリストを 1 行にする必要がある場合は、li を左浮動小数点に設定するだけです。

上記の CSS コンテンツをマスターしたら、基本的に開始します。

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