あら・・・

<font style="font-size:30px;">大きな文字</font>

が正解です(´･ω･`)

(Sep 14, 2004 01:53:38 AM)

000000

ホーム | 日記 | プロフィール

【フォローする】【ログイン】

七鍵＠楽天

コメント新着

うしまる＠ @ Re:タグを覚えよう【第１５回目】　-　中央寄せ表示の際の小技(08/21) タグの検索でぐぐってたらコチラに辿り着…

k.kyouka @ すきやき占い『しいたけ』の重要度27% 『しいたけ』…

なな@ Re:迷っています(11/01) レオ　がいいですよ☆★

マロン@ かわいいキュート

ｆｏｏｌｉｓｈ☆ｆｏｏ @ Re[1]:お久しぶりです。(07/15) ＞実演を踏まえてテストをしておりました…

バックナンバー

Dec , 2024
Nov , 2024

Oct , 2024

フリーページ

HTMLタグに挑戦

< 新しい記事

新着記事一覧(全310件)

過去の記事 >

Sep 14, 2004

前回の「タグってなに？」という話で、
「文字の大きさ、色、太字、見出し、画像表示、表、などなど、Ｗｅｂページに必要な命令はHTML タグにて命令する」
と解説を行いましたよね。
しかし実はこれ、正確な表現ではないのです(´･ω･`)
本来ＨＴＭＬは効率的に情報を発信できるように、
文書の構造を記述することが主な目的となっています。
ですから、そこに文字の色や形など見栄えに関する情報を記述してしまいますと、
せっかくの大事な情報が見栄えを表す記述（命令）に埋もれて不明確となり、
本来の趣旨から外れてしまうのです。

「ではどうやって、見栄えに関する命令を行えばいいの？」と当然思われるでしょう。
その答えがスタイルシートなのです(〃⌒▽⌒)
スタイルシートを使用することにより、
本文とは別に見栄えのルールを設定することができます。
そればかりではありません(￣▽￣人)
このスタイルシートを外部ファイルとして保存することにより、
Ｗｅｂサイト全体で統一した見栄えを実現することも可能ですし、
一度作成した見栄えを修正することも簡単となります。
早い話が、スタイルシートを使って文書のコンテンツや論理構造と表現のルールを分離することによって、
さまざまなメリットがうまれるというわけです。

ただ、残念ながら・・・
ここ「楽天」では外部ファイルとしてスタイルシートを保存することはできません(´･ω･`)
ページのスタイルを一括して指定する方法もとれません(´･ω･`)
ではなんのために？とおっしゃられるかもしれませんが
知っているにこしたことはありませんよね(〃⌒▽⌒)
見た目の効果だけでもタグだけで記述するよりはるかにいろいろなことができます。
しっかり基本を覚えましょう(〃⌒▽⌒)

まずは用語の定義からです。

{

color

#0000ff

;

font-size

20px

;

}

セレクタ

プロパティ

値

プロパティ

値

宣言

例として要素名「P」（段落を表すタグです）の文字色を「#0000ff」（青色）、
文字の大きさを「20px」のように表示するスタイルシートについて見てみましょう。
最初の「p」（要素名）のことをセレクタ（Selector）と呼び、
見栄え（スタイル）を適用する対象を記述します。
そして、「{」と「}」で囲まれた範囲を宣言（Declaration）と呼びます。
宣言の中にはプロパティとその値をコロン（ : ）で区切って記述します。
プロパティと値のペアはセミコロン（ ; ）で区切って複数記述することもできます。

ただし・・・
今のところ「楽天」では以上のような記述はできません(´･ω･`)
個々のタグ内に「style」属性として見栄え（スタイル）に関する情報を指定するしかないのです。
個々に見栄えを指定しますので・・・
同じ種類のタグ（要素タイプ）でも他の場所にあるタグ（要素）にはその見栄えが反映されることはありません。
また、見栄え（スタイル）を適用する対象は明らかなので、
以下のようにセレクタは記述せず、宣言のみを記述します。

□sample.html
<html> <head> <title></title> </head> <body> <p style=" color:#0000ff;font-size:20px; "> ここの段落にスタイルが適用されます。 </p> </body> </html>

以上、楽天ではだめ、楽天ではだめ・・・ばかりの説明でしたが(´･ω･`)
理解できたでしょうか？
大事なのは・・・
HTMLは文書の構造を表すものであって見栄えを表すものでは無い、ということです。
見栄えはスタイルシートを使用し表現するものなのですね(〃⌒▽⌒)

では、また明日ー(ﾟ▽^*)ﾉ⌒☆

お気に入りの記事を「いいね！」で応援しよう

最終更新日 Sep 14, 2004 12:28:59 AM
コメント(5) | コメントを書く

[タグ教室] カテゴリの最新記事

■コメント

Re:タグを覚えよう【第３５回目】　-　スタイルシートってなに？(09/14)

な～～るさん

先生・・質問です。このスタイルタグの隣に文字とか色々入れたい場合、どうしたらいいのでしょう？
ちょうど今行き詰っているのです。しくしく・・(T^T) (Sep 14, 2004 01:45:32 AM)

返事を書く

Re[1]:タグを覚えよう【第３５回目】　-　スタイルシートってなに？(09/14)

＃七鍵さん

な～～るさん

いらっしゃーい(〃⌒▽⌒)

スタイルタグの隣に文字・・・ってどんなイメージでしょう？
スタイルシートは何かのタグに対して指定するんですよ(〃⌒▽⌒)
例えば・・・

<font style="font-size:30px;">大きな文字</font>

のような感じですね(￣▽￣人)

(Sep 14, 2004 01:52:44 AM)

返事を書く

Re[2]:タグを覚えよう【第３５回目】　-　スタイルシートってなに？(09/14)

＃七鍵さん

Re[3]:タグを覚えよう【第３５回目】　-　スタイルシートってなに？(09/14)

な～～るさん

＃七鍵さん
-----
ごめんなさい。勘違いでした。
リストの・・例えば、向かって右側に絵を入れたい場合、前に日記で習いました
table で囲って、td alignというので
いいのかなぁ？？・・と、思ったのですが、それが、妙にリストが細長くなって
ヘンチクリンになってしまったのです。
そういう場合は、tableを使わないで、
やるのかなぁ？
その辺りを知りたかったのです。
本当は、画面を分割してやるんでしょうが、
どうやるのか分かりません。
やりたいことは、なにかというと、
単純に左にリストを表示して、右側に文字や絵を入れたいのです。
どうしたらいいのでしょうか？
とっても長すぎてごめんなさい。 (Sep 16, 2004 10:41:40 PM)

返事を書く

Re[4]:タグを覚えよう【第３５回目】　-　スタイルシートってなに？(09/14)

＃七鍵さん

な～～るさん

いらっしゃーい(〃⌒▽⌒)

今日の返事は日記にてさせてもらいました(￣▽￣人)
また見て下さいねm（_ _）m

(Sep 17, 2004 07:45:15 AM)

返事を書く