DIV+CSS の初心者向けに最も役立つ 10 の CSS コード [転送]_html/css_WEB-ITnose

私の個人的な経験に基づいて、よく使われる CSS のヒントをまとめました。初心者の友人に役立つことを願っています:

1.float:left
機能: 複数の div を並列および並べて作成します。 :

2.clear:both
機能: 複数の div を並列に配置する場合、空の div を追加して、clear:both で記述する必要があります。制限を課さない場合、IE では正常に表示されますが、Firefox では誤字脱字が発生するためです。
使用法:

3.margin:0 auto
機能: ページを中央揃えにして配置したい場合、幅は画面の幅と等しくありません。このようにして、margin:0 auto はその巨大な値を示します
Usage:

4.margin:0px
Function:ページにフォームを追加しましたが、どのように調整しても常に改行されたり、外側のコンテナが展開されたりして、レイアウトを調整できませんでした。 margin:0px を使用してください
Usage:

5.margin:-x px
機能: 画像とスパンテキストコンテンツを並べて配置したい場合、高低が常に不一致になることがわかります。このように、マージンを使用して外側マージンを定義できます。この値は負の値にすることもできます

使用法:
(画像が 2px 上に移動することを示します)
6.padding:x px
関数: コンテンツとコンテナーの間に一定の距離を空けるにはどうすればよいですか?これがパディングの役割です。ここで言及するのは、その使用法に注意するためです。

データは次のとおりです。 /div>(この div の表示の高さは何ですか? 30px)
7.line-height:x px
機能: 多くの場合、テキストが近すぎて煩わしく見えます。次に、行間隔を広げ、line-height を使用して行の高さを定義します。 使用法:

ここにデータがあります!

: リンクのプロパティを定義します。初心者はよく「CSS プロパティを定義しているのに、なぜ正しく表示されないのですか?」と尋ねる傾向があります。その場合、a の順序を間違える可能性があります。正しい順序は lvha です。
Usage:
a:link{
font-size:12px;font-family:宋体;font-weight:bolder;color:red;text -decoration:none;
}
a:visited{
font-size:12px;font-family:太字;color:red;text-decoration:none;
}
a:hover{
font -size:12px;font-family:宋体;font-weight:bolder;color:orange;text-decoration:underline;
}
a:actived{
font-size:12px;font-family:宋体;font-weight :bolder;color:red;text-decoration:none;
}
9:border:0px
機能: 画像にリンクを追加すると、煩わしい境界線が表示されます。このとき、それを削除するには 0 と定義します。それ。
使用法:
< ;/a>
10:display:none
機能: オブジェクトを非表示にする必要がある場合がありますが、現時点では表示が最適です。多くのオンライン エディターの編集モードで特に便利です。
使用法:
IFRAME ID="eWebEditor1" src=" /eWebEditor /ewebeditor.htm?id=content&style=coolblue" Frameborder="0"scrolling="no" width="550" height="350">(データベースに新しいコンテンツを追加する場合)
< ; textarea name="content" id="content" style="display:none;"><%=data%>
(データベース コンテンツの更新時に使用)

関連ラベル：

DIV+CSS中10句新手最有用的css代码[转]

ソース：php.cn

前の記事：div+CSSで長い英語文字を自動的に折り返すにはどうすればよいですか? _html/css_WEB-ITnose 次の記事：DIV+CSS_html/css_WEB-ITnose でよく使用される基本的な知識

このウェブサイトの声明

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

著者別の最新記事

• BlackRock Labels BTC a Unique Diversifier
  2024-09-20 15:51:33
• Internet Computer (ICP) Price Prediction: Will ICP Price Hit $24?
  2024-09-20 15:47:32
• Worldcoin (WLD) Price Prediction 2022-23
  2024-09-20 15:45:32
• 今日投資すべきトップミームコイン
  2024-09-20 15:39:32
• Floki (FLOKI) 価格予測: 刷新されたマーケティングは Floki が 10 月の利益を取り戻すのに役立ちますか?
  2024-09-20 15:38:32
• Next Cryptocurrency to Explode: 5 Coins to Add to Your Watchlist
  2024-09-20 15:27:32
• Dogecoin: From an Internet Meme to a Digital Currency with a Billion-Dollar Market Capitalization
  2024-09-20 15:26:32
• ZChains Unveils a Series of Exciting Updates and Launches to Enhance Its Ecosystem
  2024-09-20 15:12:32
• Apple 版の Little Fox Payment Platform をダウンロードする方法
  2024-09-20 14:53:01
• 初心者がMetaMaskで取引する方法とその利点と欠点
  2024-09-20 14:51:01

最新の問題

function_exists() はカスタム関数を決定できません Function test () {return true;} if (function_exists ('test')) {echo "テストは関数です";

から 2024-04-29 11:01:01

0

2

1454

Google Chromeのモバイル版を表示する方法 こんにちは、先生、Google Chrome をモバイル版に変更するにはどうすればよいですか?

から 2024-04-23 00:22:19

0

10

1622

子ウィンドウは親ウィンドウを操作しますが、出力は応答しません。 最初の 2 つの文は実行可能ですが、最後の文は実装できません。

から 2024-04-19 15:37:47

0

1

1385

親ウィンドウには出力がありません document.onclick = function(){ window.opener.document.write('私は子ウィンドウの出力です');

から 2024-04-18 23:52:34

0

1

1305

CSS マインド マッピングに関するコースウェアはどこにありますか? コースウェア

から 2024-04-16 10:10:18

0

0

1357

関連トピック

詳細>

• デフォルトゲートウェイの設定方法
• CSSとは何ですか
• mdsファイルを開く方法
• 登録不要のCDNアクセラレーションサービス
• リップルにはまだ投資価値があるのでしょうか？
• 全角文字とはどういう意味ですか?
• css3transition
• getpropertyの使用法