チェックフィールド株式会社

東京 港区 千代田区 中央区 ITの運用管理やコンサルティング・相談・サポートはITコンシェルジュにお任せください

スタッフぶろぐ

検索カテゴリー:《 HTML講座 》

2 / 3  1 2 3

F初心者にやさしいHTML講座:画像とその左または右に説明文をレイアウトする

前回に引き続き画像のレイアウト方法をご紹介します。 画像を配置した後、その右側に説明文を表示するには次のように記述します。 出力結果 従来の商品よりも軽く耐久性があります。コンパクトサイズながら連続再生時間が約10時間と […]

続きを読む

F初心者にやさしいHTML講座:画像と説明文をレイアウトする

画像とその説明文をレイアウトするいくつかのパターンがあります。 【A】画像の上または下に説明文をレイアウトする 【B】画像の左または右に説明文をレイアウトする 【C】複数の画像と説明文をレイアウトする これから数回にわた […]

続きを読む

F初心者にやさしいHTML講座:行間を設定する

お知らせや商品情報など、まとまった文章を表示させる場合、行間にゆとりがあった方が読みやすくなります。行間は「line-height」プロパティで設定します。値はpxや%で指定ができますが、おすすめは単位を記入しない方法で […]

続きを読む

F初心者にやさしいHTML講座:ボーダーを設定する

ボーダーを設定する 以前お伝えした方法はtext-decorationを使った方法でしたが、今回はテキストや文章全体にボーダー(線・枠)を設定する方法をご紹介します。 borderプロパティを利用します。 text-de […]

続きを読む

F初心者にやさしいHTML講座:テキストに下線を付ける

テキストに下線を付ける 今回はテキストに下線を付けます。 下線をつけるテキストをタグで取り囲んで「text-decoration:underline;」と記述します。 出力結果 キャンペーン特別価格です! 文章の一部だけ […]

続きを読む

F初心者にやさしいHTML講座:行揃えの設定方法

行揃えの設定方法 今回は行揃えを設定します。例えば、Wordで文章を書く時のように左寄せ、中央揃え、右寄せをCSSの「text-align」で設定することができます。 text-align:left;  左寄せtext- […]

続きを読む

F初心者にやさしいHTML講座:文字間隔の設定方法

文字間隔の設定方法 今回は文字の間隔を設定します。 例えば、 新商品のお知らせ という見出しを 新 商 品 の お 知 ら せ のように、文字と文字の間隔を広げることで目立たせる効果があります。 文字と文字の間を10px […]

続きを読む

F初心者にやさしいHTML講座:余白の設定 その2

前回のおさらい 文字の背景を赤色にして、文字色を白色にするには 出力結果 特価 となります。「特価」や「お買い得」など目立たせたい場合によく使用します。 内側の余白(パディング)の設定方法 今回は文字の内側の余白の取り方 […]

続きを読む

F初心者にやさしいHTML講座:余白の設定

外側の余白(マージン)の設定方法 今回は文字の外側の余白(マージン)の取り方を設定します。 段落と段落の間のマージンを大きく取りたい場合はマージンを設定します。 5pxのマージンをいれる場合は margin:5px; を […]

続きを読む

F初心者にやさしいHTML講座:文字色の変更

前回のおさらいと文字色の変更 前回からCSSという記述方法をご紹介しています。例えば背景色を変更するには と記述します。今日はさらにデザインを追加していきます。 背景を緑色、文字は白色…と、デザインしたい箇所が複数になっ […]

続きを読む
2 / 3  1 2 3