• ベストアンサー
※ ChatGPTを利用し、要約された質問です（原文：HTML、CSSについて教えてください。）

HTML、CSSについて教えてください

このQ&Aのポイント
  • HTML、CSSについて教えてください。縦二段、右から左へ移行する方法や、テキストの配置について質問があります。
  • HTML、CSSで縦二段、右から左へ移行する方法やテキストの配置について質問があります。具体的な記述方法について教えてください。
  • HTML、CSSについての質問です。縦二段にする方法や右から左へ移行する方法、テキストの配置について教えてください。

質問者が選んだベストアンサー

  • ベストアンサー
回答No.4

補足ありがとうございます。どこに書けばいいのかがわからないのであれば、やはりCSSの基本から学ぶ必要があると思います。まずは下記３種類の書き方を覚えること、そして簡単なところ（文字の色や大きさを変えるなど）から始めることをおすすめします。 【1.style属性を使った書き方】 <p style="text-align: right;">文字が右寄せになります</p> 《style》という属性を使って、HTML内に直接CSSを書いていく方法です。一番書きやすくて覚えやすい方法だと思いますが、やりすぎるとHTMLがゴチャゴチャになるという欠点もあります。 【2.<style>タグを使った書き方】 <!DOCTYPE html> <html lang="ja"> <head> <style> p { text-align: right; } </style> </head> <body> <p>文字が右寄せになります</p> </body> </html> HTMLファイル内に<style>というタグを（一般的には<head></head>のなかに）追加し、ここにCSSを書いていきます。１の方法にくらべると難しくなりますが、まとめて一回でCSSを指定できるという長所があります。わかりやすくいえば、何度も何度も《height="500"》や《face="ＭＳ 明朝"》を書かなくて済むということです。 【3.外部CSSファイルをつくる方法】 《↓HTMLファイル：index.html》 <!DOCTYPE html> <html lang="ja"> <head> <link rel="stylesheet" href="sample.css" /> <!-- ここで外部のCSSファイルを読み込む --> </head> <body> <p>文字が右寄せになります</p> </body> </html> 《↓外部CSSファイル：sample.css》 @charset "shift_jis"; p { text-align: right; } HTMLとCSSをそれぞれ別に用意し、別の場所にある《sample.css》をHTML側の<link>タグを使って読み込む方法です。一番難しい方法ですが、HTMLとCSSを別々に管理できるため、HTMLファイルがシンプルになって見やすくなります。質問者さんが『外部記述』と書いているところと同じ方法ですが、外部のCSSファイルに<html>や<head>は不要です。このあたりの書き方が間違っているために、外部記述のCSSが正常に動いていないのだと思います。 CSSというのは奥が深く、なかなかネット上の文章だけで説明するのは難しいです。２番さんもおっしゃっていますが、できれば本とネットを併用しながら勉強していったほうがいいのではないかと思います。外部CSSファイルをつくる方法は少し難しいので、まずは２番目の方法、<style>タグを使って書くところから始めてみてください。

参考URL：
http://htmq.com/csskihon/004.shtml
nino01
質問者

お礼

いやー！　ありがとうございます。 ９月２日から始まって、今回で三回目の質問投稿で、やっとここまでたどり着けました。 皆さんのお陰ですが、素人の私にとって、Katsu_Kaizさんの懇切丁寧なご回答は、何ものにも勝る励ましとなります。 まだ完成はしておりませんが、何度も試行錯誤を重ねながら完成させたいと思っています。 実を申しますと、皆さんにお詫びしなければならないのですが、私は物書きで、ここで質問させていただいたのは二義的なものです。 しかし、第一義を成功させるためには、どうしても、この第二義を作り上げなければならなかったのです。 最初から二義的などと申しますと、真剣にご回答いただいている皆さんに失礼になるのではないかと案じたからです。 大変申し訳ございません。深くお詫び申し上げます。 第一、第二とも完成しましたら、改めて御礼を申し上げたいと存じます。 ありがとうございました。

すると、全ての回答が全文表示されます。

その他の回答 (3)

回答No.3

どういうふうなところへ持っていきたいのか、いまひとつわかりづらいのですが……。 数字を右寄せしたいのであれば、たとえば p { text-align: right; } などになるのではないでしょうか。 また、『writing-mode』というCSSを知らなかったので調べてみましたが、いわゆるIE独自拡張のCSSみたいですね。こういうのはIE以外のブラウザでは動かないこともあるため、使うときには注意が必要です。というよりも、初心者の人が無理して使うようなものではありません。 さらに、空間や段差についてはheightだけではなく、widthも指定してあげないとブラウザの幅によってズレるかと思います。そしてもうひとついえば、《sample.css》の書き方が申しわけないですが全然ちがいます。 そもそも、皆さんもおっしゃっていますが全体的に書き方が古いです。《fontタグ》や《align属性》などは、今となっては使わないほうがいいとされています。それに、古い書き方で新しいこと（縦書き）に挑戦しようとするといろんなところで苦労します。 いきなり難しい縦書きに挑戦するのではなく、まずはHTMLとCSSの基本から勉強されたほうが、いまよりも記述もシンプル（たぶん今の半分くらいに減らせます）になって縦書きにも挑戦しやすくなると思います。

参考URL：
http://htmq.com/style/writing-mode.shtml
nino01
質問者

お礼

OKウェブの終了手続きを知らず、補足コメント欄で御礼申し上げたので、それで良いと思っていました。 今更ながらですが、改めてお礼申し上げます。

nino01
質問者

補足

ありがとうございます。 p { text-align: right; } をどこに記述するのか解りませんが、 とにかくやってみます。

すると、全ての回答が全文表示されます。
回答No.2

直接答えではありませんが、 HTML 4.0を勉強したいのではないですよね。 書かれている記述が古いです。HTML５の時代なので、勉強している本、サイトを変えましょう。

nino01
質問者

お礼

OKウェブの終了手続きをしらず、補足コメントで御礼申し上げたので、それで良いと思っていました。お詫び申し上げます。

nino01
質問者

補足

『HTML５』の時代ですか。こんなことも知りませんでした。 さっそく、検索してとかかってみます。 ありがとうございました。

すると、全ての回答が全文表示されます。
  • dragon-man
  • ベストアンサー率19% (2714/13698)
回答No.1

言うまでもなくHTML、CSSは記述言語で、この段階はプログラミングで言えばまさにデバッグフェーズです。バグの直し方が分からないと言って、いちいち人に聞いていたのでは、いつまでたっても完成しません。ブラウザ表示が目的に合わないのは、確実にどこかの記述が文法的に間違っているのです。つまりバグです。それは自分で見つけて治すしかありません。この質問箱を利用して他人にデバッグさせるのは如何なものか。余計なことを言って済みません。

nino01
質問者

お礼

OKウェブの終了手順を知らず、補足コメントで終了したつもりになっていました。今更ながらですが、改めて、御礼申し上げます。

nino01
質問者

補足

＞それは自分で見つけて治すしかありません。 おっしゃる通りだと思います。 これでも一生懸命やったつもりです（汗）。 参考サイトかヒントでも与えて頂ければ幸いです。 ＞質問箱を利用して他人にデバッグさせるのは如何なものか。 とんでもありません。溺れかかって、取り付く島を探しています。 よろしくお願い申し上げます。

すると、全ての回答が全文表示されます。
  1. カテゴリ
  2. パソコン・スマートフォン
  3. ソフトウェア
  4. ホームページ作成ソフト

注目のQ&A

カテゴリ

OKWAVE コラム

あなたにピッタリな商品が見つかる！ OKWAVE セレクト

専門家に質問してみよう

職業から探して質問する
質問する