wulin.com HTMLチュートリアル列に戻るには、ここをクリックしてください。 CSSチュートリアルを閲覧したい場合は、ここをクリックしてください。
上：マークアップ言語CSSレイアウト。第13章テキストのスタイルを指定します
章でテキストスタイルを設定するためにCSSを使用する慣行について議論することをお勧めします。一般的に言えば、テキストコンテンツの処理は、おそらく標準に完全に準拠していないWebサイトでも、CSSが最も使用される場所です。 Webページの繰り返しタグを削除することは、かつて（そして今では）デザイナーにとって非常に魅力的でした。テキスト印刷を制御するためにCSSを使用すること、つまりコンテンツと表示方法をさらに分離するという大きな利点を見ることは難しくありません。
多くの以前の例から、CSSは多くの状況に対処できることを知っています。テキストスタイルの設定は、最も基本的なWebページにデザイン要素を追加する最も簡単な方法です。同時に、テキストにCSSを追加すると、ページに不必要な写真を追加することもできません。
この章では、CSSが退屈で普通のテキストを別の高さ（新しい色、サイズ、フォント）にどのように取るかを確認します。ハイパーテキストをよりクーラーに見せる方法は？
テキストスタイルを指定することは、CSSが優れている最高の仕事の1つであり、わずかに古く、CSS Advanced関数をサポートしていないブラウザに直面している場合でも。過去には、デザイナーと開発者は、サイズと大胆な効果を実現するためにテキストを設計する際に、今日の標準で耐えられず困難なWebページを作成したいと思うかもしれません（テキストがほとんど画像で表されているWebページを見たことがありますか？
写真を使用して上記の質問に答えるためのいくつかの選択肢を提供するために、この章では、まだスタイリングされていないテキストの段落から始め、徐々にさまざまなCSSルールを追加して、魅力的なデザインになります。絶えず変化する時代
まず、ブラウザのプリセットフォントで処理されるテキストを見ることから始めます。私の場合、プリセットフォントは16ピクセル時間です。 Mac OS XでSafariブラウザを使用します。このため、表示されるテキストは反拡張方法で描かれます。 Windows XPを使用してClearTypeを開始すると、同様の効果がわかります。
時間（またはバリアントタイムの新しいローマ）は多くのブラウザーのプリセットフォントですが、これはユーザーが独自のお気に入りのフォントに簡単に変更するため、このプリセット値に頼ることはできません。
図1301は、この章で使用したテキストコンテンツを、スタイルで追加されていないテキストコンテンツを示しています。<h1>でマークされたシンプルなタイトル、そしてここに家の装飾のための3つのヒントがあります。
図13-1ブラウザにタイトルが表示され、テキストのプリセット効果が行の高さを変更します
最もシンプルで最も効果的なテキストスタイル効果の1つは、ラインハイイト属性です。テキストの各行に余分なスペースを追加すると、テキストの段落を読みやすく、より魅力的にし、ページに素晴らしい効果をもたらすことができます。
次のCSSルールを<body>タグに追加して、この手法を完了できます。もちろん、このルールを他のタグに追加することもできます。たとえば、<p>の線の高さを変更したいだけです。
体 {
Line-Height：1.5em;
}
このコードの意味は、ページ上のテキストの線の高さは、テキストの高さの1.5倍でなければなりません。ラインハイイトを指定するときにEMユニットを使用するのが好きです。フォントサイズで変更されるためです。
図13-2は、ラインハイイトを追加した後の効果を示しています。
図13-2プリセットテキストと行の高さの後の効果
見た目は素晴らしく、小さなラインハイトが達成できる結果は驚くべきものです。
前のページ1 2 3 4 5次のページ全文を読む