HTMLで表現できなくて困っています。

硫酸鉄の"FeSO4"などの表記の4を下にすこしずらしたいと思っているのですが、<sub>ではスタイルシートを使っている文字に対しては上手くいきません。

是非どなたかお教えください。

このQ&Aに関連する最新のQ&A

A 回答 (4件)

 こんにちは。



 もっとスマートな解決策があるんじゃないかと思いつつですが。

1)下付き文字にする数字(質問で言えば「4」)のフォントサイズを小さくして
2)その数字だけに <vertical-align:sub;> を適用する。

 こんな感じです。(余分な部分は省略)

~冒頭部省略~
<style TYPE="text/css">
p{font-size:20px;}
</style>
~中略~
<p>FeS0<span style="font-size:14px;vertical-align:sub;">4</span></p>
~以下略~

 試してみてください。

 参考になれば幸いです。
    • good
    • 0
この回答へのお礼

ありがとうございます。
レスが遅れましてスミマセン。

すごくわかり易く大変参考になりました。
verticalまで指定すると、ぶら下がりすぎる感じがしたので、<span style="font-size:75%">にしました。

ありがとうございました。

お礼日時:2002/03/19 13:07

JavaScriptバージョン


<body>
<div style="font-size:9pt;">
<script language="JavaScript">
document.write( "FeSO" + "4".sub() );
</script>
</div>
</body>
    • good
    • 0
この回答へのお礼

ありがとうございます。

こんな方法もあるのか、と考えさせられます。
はじめは、???と思いました。

とりあえず、インラインにしてみて、たくさんあるようなら、CSSクラスにアサインしてみようと思っています。

お礼日時:2002/03/19 13:13

.txtsub{ vertical-align:sub; }


として
<div>FeSO<span class="txtsub">4</span></div>

"vertical-align"はいつ廃止になるかわかりませんが・・・
    • good
    • 0

では、スタイルシートで下付きにしましょう。

たとえば、

FeSO<span style="font-size:70%">4</span>

という感じではいかが?
    • good
    • 0
この回答へのお礼

ありがとうございます。

サイズを小さくするのが一番綺麗に見えるように思いました。

お礼日時:2002/03/19 13:08

このQ&Aに関連する人気のQ&A

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!

このQ&Aと関連する良く見られている質問

Qプログラミング入門に最適な言語

プログラミング入門に最適な言語
最近プログラミングに興味をもって、プログラミングに挑戦しようと思ってます。

最終的にC++へ行くつもりですが、何の言語からはじめるのがいいでしょうか。
よろしくお願いします。

Aベストアンサー

議論百出だろうと思います。

「Cを身につけてからC++を学ぶべきである」
と言う人もいるでしょう。

私は、そうは思いません。
(Cをバイパスし)いきなりC++で構わないと思います。

プログラミングが全く未経験であれば、
やはりGUIで結果がグラフィカルに出た方が楽しいと思います。

有償になってしまいますが
MFCを搭載したVC++ Standerd以上をお勧めします。

また、別の方法として
多少回り道になりますが
C#という手もあります。

これなら無償のExpressでも十分にGUI制作が楽しめます。

まずは、プログラミングの楽しさ、醍醐味を味わってみてください。

入門書等についてですが
あなたが趣味でコツコツプログラミングをし、
出来たものを自分だけで使うのが目的なら
何でもいいです。

ただし、プログラムを公開する
(フリー、商用問わず)
また、ソースコード(一部でも)
(こういうサイトで質問の為に提示することを含む)
つもりがあるなら、

「きちんとした書籍」

で学ぶことをお勧めします。
「10日で・・・」
とかうたっている物の中には
「動けばいい!」
という姿勢で書かれたものが多く、
ソースコードが非常に読みにくいです。

読みやすいソースコードであれば
こういうサイトでも回答が付きやすいですが、
読みにくいソースコードは
分析に非常に時間がかかるので
回答がなかなかつきません。

また、読みやすいソースコードは
バージョンアップも簡単ですし、

一般に
(例外はありますが)
動作も早く、コンパクトです。

頑張ってください!!!

議論百出だろうと思います。

「Cを身につけてからC++を学ぶべきである」
と言う人もいるでしょう。

私は、そうは思いません。
(Cをバイパスし)いきなりC++で構わないと思います。

プログラミングが全く未経験であれば、
やはりGUIで結果がグラフィカルに出た方が楽しいと思います。

有償になってしまいますが
MFCを搭載したVC++ Standerd以上をお勧めします。

また、別の方法として
多少回り道になりますが
C#という手もあります。

これなら無償のExpressでも十分にGUI制作が楽しめま...続きを読む

Qフレームをずらして4つに分けるには?

フレームの分割について教えてください。
縦に2:8に分けた後、その「2」のほうを横に半分にしたいんです。(フレームの境界線はは十字にならない)。
いろんな分割例があったのですが、該当するものが見つかりませんでした。
ご存知の方は、教えてください。

Aベストアンサー

#1です。
すいませんタイトルは4つに…となっていましたね。
それでは

<frameset cols="20%,80%">
<frameset rows="200,*">
<frame src="xxxx.html">
<frame src="xxxx.html">
</frameset>
<frameset rows="300,*">
<frame src="xxxx.html">
<frame src="xxxx.html">
</frameset>

で、やってみてください。
数字は任意で変えてください。

Qコンピュータープログラミング入門の本

コンピュータープログラミングを独学で学びたいと思ってます。
どのようなことがやりたいか一概にいえませんが、当面はHPを好き勝手に作れるようになったり、ある程度プログラミングが理解できるようになりたいと思ってます。
入門の本(解りやすく飽きさせない、ある程度網羅できる)
という本はないでしょうか??
お願いします。

Aベストアンサー

還暦まじかのじっちゃまです。
服飾デザイナでプログラマではありませんので参考程度に。

さて、数年前に「人もすなるHPとやらを我も」と思い立ちました。
まず、やったことは、HTMLとCSSとに関するW3Cの勧告の日本語訳のダウンロードと印刷。
脇に揃えた参考書は2冊です。

「プログラミング言語C第2版」(カーニハン&リッチー著)
「Web標準の教科書」(益子貴寛著)

HP作成の入門書は数あれど、所詮は、W3Cの勧告をあちこち抜粋したもの。
ですから、W3C勧告の入手をお勧めします。

「プログラミング言語C第2版」は、JavaScript の習得のためです。
同著の例文をJavaScriptで書けるようになれば、ほぼ、同言語の文法的なマスターは終了。
「プログラミング言語C第2版」は、かなり古いです。
だが、その例文の再現は、プログラミングの習得にもなり一石二鳥じゃないですかね。
かなり、プログラミングに関する基本的なことが学べますよ。

「Web標準の教科書」は、「XHTMLとCSSでサイトをつくる」上では大変に参考になりました。

なお、プログラミングの独学の成否は、入門書ではなくヘルプ文のみで壁を突破できるか否か。
還暦まじかのじっちゃまは、このように思いますよ。

還暦まじかのじっちゃまです。
服飾デザイナでプログラマではありませんので参考程度に。

さて、数年前に「人もすなるHPとやらを我も」と思い立ちました。
まず、やったことは、HTMLとCSSとに関するW3Cの勧告の日本語訳のダウンロードと印刷。
脇に揃えた参考書は2冊です。

「プログラミング言語C第2版」(カーニハン&リッチー著)
「Web標準の教科書」(益子貴寛著)

HP作成の入門書は数あれど、所詮は、W3Cの勧告をあちこち抜粋したもの。
ですから、W3C勧告の入手をお勧めします。

「プログ...続きを読む

Qスタイルシートで特定IDかつ特定クラスの要素のスタイルを設定するには?

<div id="hoge" class="piyo">~</div>
上記のように特定IDかつ特定クラスの要素にのみスタイルを適用させるには
CSSにどのように記述すればよいでしょうか?
div#hoge.piyo、div.piyo#hogeいずれも試してみましたがうまく動きませんでした。

Aベストアンサー

というか・・・

idはユニークなはずですから、idで指定しているという時点でidの
スタイルが適用されてよいのでは?

またclassは複数指定ができますので、
<div id="hoge" class="piyo hogepiyo">~</div>として
hogepiyoクラスに対してimportantで、より強いスタイルを指定すれば
よいかもしれません

Qプログラミング入門

プログラミング入門
今、私はプログラミングの勉強をしたいなーと思っています。それでホント初心者でも一からできるソフトはないでしょうか?または詳しく乗っているサイトを教えてください<m(__)m>
できればJAVAかCがいいです

Aベストアンサー

こういうのって人それぞれだと思いますが^^;

とりあえず、私は

http://wisdom.sakura.ne.jp/

このサイトで育ちました。

これから始めると言うのであれば開発環境が整っている言語が楽だと思うので

フリーならば

eclipseでjava

http://www.javadrive.jp/eclipse3/

hsp

http://hsp.tv/

フリーじゃないならば

visual studioをつかってVBやc言語

もしくは#1さんがおっしゃられているようにVBAあたりでしょうか

Qスタイルシートでかけるものはスタイルシートを使った

非推奨タグでなくても、スタイルシートでかけるものはスタイルシートを使ったほうが良い?

htmlでサイトを作ってるのですが、スタイルシートを使うべきかhtmlで書くべきか、
どちらでもかける場合があります。

その際どちらを使ったほうがいいのでしょうか?

Aベストアンサー

判断は、「どちらでもかける場合があります」ではありませんよ。
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
 「構造とプレゼンテーションの分離( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/intro/intro.html#h-2.4.1 )」という根本を理解していないと、この質問になります。
 HTMLは、あくまで文書構造をマークアップするものです。例えば、太字で表示したい語句があったとします。
[例文]
 「構造とプレゼンテーションの分離」という概念を理解しておかなければなりません。
 いにしえの昔の武士の侍が、馬から落ちて落馬して、・・・【中略】・・・腹を切って切腹した。

 ここで、「構造とプレゼンテーションの分離」が重要なのでしたら
<p>
 <strong>「構造とプレゼンテーションの分離」</strong>という概念を理解しておかなければなりません
</p>
でしょうし
<p>
 <b>いにしえ</b>の<b>昔</b>の<b>武士</b>の<b>侍が、<b>馬から落ちて</b><b>落馬</b>して、・・・【中略】・・・<b>腹を切って</b><b>切腹</b>した。
</p>
 でしょう。

 その上で、スタイルシートで
p strong{color:red;font-weight:normal;}
p b{color:green;font-weight:normal;text-decoration:underline;}
とか・・
 しかし、すくなくとも
<p>
 <span class="stong">「構造とプレゼンテーションの分離」</span>という概念を理解しておかなければなりません
</p>
とかいて
p span.strong{font-weight:bold;color:red;}
とするのは、望ましくはありません。

 もっと、良く指摘されるのが、配置をtableを使って行うことです。tableは、二次元以上のデータをマークアップするものですが、これを他の用途に使うのは誤りです。

 それぞれのタグの用途は仕様書に書かれています。
 ⇒要素索引( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/index/elements.html )
 から要素名をクリックして説明を読んでください。

>その際どちらを使ったほうがいいのでしょうか?
 それは、その要素が何であるかがわからないので、一概には答えられません。--これもわかると思います。
 HTMLは、その文書を読み解き、その文書を構成する要素に分解して、それぞれの要素をタグでマークアップしていく言語です。文書を書く本人しか、その要素(部品)をどの要素とは判断できないのです。
 そのうえで、スタイルシートで自由にプレゼンテーションを変更できる。
 ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
と考えたら答えは出ると思います。

(注)HTML4.01では、この文書構造を示すタグ--要素が足りませんでした。そのため、DIV,SAPNという要素が用意されて
『DIV要素とSPAN要素は、id属性及び class属性と併用することで、文書に構造を付加するための一般機構を提供する。( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/struct/global.html#h-7.5.4 )』
 とされていましたが、ご存知の通りこれが正しく理解されずに<div id="wrapper"><div id="contener"><div id="Left">のようなおかしなマークアップが氾濫してしまいました。本来は、<div class="article"><div class="section"><div class="nav">のようになるはずでした。
 その反省から、「HTML5 では、文書をよりよく構造化するために、( http://standards.mitsue.co.jp/resources/w3c/TR/html5-diff/#new-elements )」header,section,footerなどの新しい要素が採用され、DIVやSPANは原則使わない--他に適当な要素がないときの最後の手段となりました。

>その際どちらを使ったほうがいいのでしょうか?
 これで悩むことがありませんよう、役立てば良いです。
 1度仕様書を通しで読んでみましょう。答えはそこにあります。

判断は、「どちらでもかける場合があります」ではありませんよ。
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
 「構造とプレゼンテーションの分離( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/intro/intro.html#h-2.4.1 )」という根本を理解していないと、この質問になります。
 HTMLは、あくまで文書構造をマークアップするものです。例えば、太字で表示したい語句があったとします。
[例文]
 「構造とプレゼンテーションの分離」という概念を理解しておかなければなりません。
...続きを読む

Qデバイスドライバのプログラミングでおすすめの入門本

Deamon Toolのような仮想マウントソフトを作りたいと考えています。
そこで、いろいろ調べているとWindows Device Kit(WDK)を使ってプログラミングをする必要があることが分かりました。

実際、この種のプログラミング本は少ないようで、おすすめの入門者が読めそうな本があれば教えてください。
ちなみに、C/C++言語の知識はあります。

Aベストアンサー

Windows Driver Kitには、サンプルコードとドキュメントが含まれています。

通常のWindowsアプリケーションを作成できる技量がある技術者であれば、サンプルコードとドキュメントが入門書の代わりになります。

通常のWindowsアプリケーションを作成できる技量がないのであれば、たとえ入門書があっても、読んでて内容が理解できないでしょうし、サンプルコードとドキュメントを見ても意味不明でしょう。

そういう訳で「入門書が要らない」ので「入門書がない」のです。

まずは、Windows Driver Kitのインストールセットを入手し、インストールしましょう。

Qスタイルシート(CSS)の中にテーブルのようなスタイルシートをつくりたいです。

Dreamweaver8にてHPを作成しております。

今回CSSをやってみようと思い試行錯誤しながらがんばっているのですが、
現在スタイルシートのfloatタグなどを使って、
ヘッダー、メニュー、コンテンツ、フッターというよくある構成で作っております。
そしてコンテンツ部分以外はテンプレート機能を使い共有できるようにしています。

そして新しいページを作る際、コンテンツ部分だけを編集していくのですが、真ん中で2つにわかれた2段組の文章をつくりたくて、テーブルを使用したところ、テーブルが縦に長くなるとCSSで指定した範囲を超えてしまいレイアウトが崩れてしまいます。

これがテーブルでなく文章でなら縦に長くなっても自動的にCSSの高さが長くなってくれます。

ですので、題名のようにCSSでテーブルのような機能のあるものを教えていただきたいのですが、素人でなにぶん申し訳ないですがよろしくお願い致しますm(_ _)m

Aベストアンサー

横に2つ並べるのでしたら「float: left;」を入れると横に並びます。
ただ、テーブル幅を狭く設定して<div class="table">~</div>をずらっと
並べてしまうと、その分だけ横にテーブルが並んだようになってしまうので
その場合はひとつひとつ指定しなくてはならなくなります。

> 画像を挿入するとなぜか枠線が消えてしまうのですが、どうしてでしょうか。
これはテーブルの背景に画像を挿入されているということでしょうか?
それともbodyの中にということでしょうか?
枠線の色をかなり薄いグレーに設定しているので(#cccccc)
そこを別の色に変えると出てきませんか?

> その幅ではできずテキストを入力するにつれて枠線の幅も自動的的に伸びていくという感じです。
下記のCSSの記入方法で何度か試してみたのですが、テキストは延々と伸びていかず
きちんと自動的に折れ曲がってくれるのですが…。spanではなくdivで書かれてみてはどうでしょうか。

CSSファイル例

.table{
float: left;
width: 200px ;/*テーブルの幅*/
background-color: #ffffff;/*テーブルの色*/
background-image : url(sample.gif);/*テーブルの中に入れる画像(画像ファイル名は任意) */
margin: 10px;/*テーブルとテーブルの余白*/
border: solid 1px #000000;/*テーブルの枠の色(今回は黒)*/
padding: 0.5em;/*文字周りの余白*/

html記入例

<body>
<div class="table">文字など文字など文字など文字など文字など文字など文字など文字など</div>
<div class="table">文字など文字など文字など文字など文字など文字など文字など文字など</div>
</body>

横に2つ並べるのでしたら「float: left;」を入れると横に並びます。
ただ、テーブル幅を狭く設定して<div class="table">~</div>をずらっと
並べてしまうと、その分だけ横にテーブルが並んだようになってしまうので
その場合はひとつひとつ指定しなくてはならなくなります。

> 画像を挿入するとなぜか枠線が消えてしまうのですが、どうしてでしょうか。
これはテーブルの背景に画像を挿入されているということでしょうか?
それともbodyの中にということでしょうか?
枠線の色をかなり薄いグレーに設定...続きを読む

Qプログラミング入門者、言語の選択?

プログラミングは本当に初めてですが、言語の選択について質問させて下さい。
ある事がキッカケでプログラミングなる物を初めてみようと思ったのですが、
javaであったり、C+であったり・・・と色々な言語がある様で戸惑っています。
それぞれの言語を勉強するに当たり、必要な環境等は書店で売られている入門書で十分理解出来る(内容では無く用意するソフト等の事)のですが、入門の入門にでも該当するのでしょうか?どの言語が何に向いている(又は初心者向けor上級者向け等)と言った基礎の基礎って意外と無いものです。
家計簿ソフトの様な物(用途は違う)が出来たら最高なのですが、何(言語)から勉強したら良いのでしょう?
難易度の高低より、出来れば投資額が少なく、汎用性を重視したいのですが・・・
Windows CE等のPDAなんかでも稼働するソフトなら更に良いのですが・・・。
ps:難易度の高低より・・・以降の希望が無謀な事なのかどうかも分からない位ですが、
   初めて見ようと思った気持ちを大切に恥ずかしながら質問させて頂きます。よろしくお願いします。

Aベストアンサー

Excelはどうでしょう?

Excel???なんて思われるかもしれませんが、マクロ機能の中にVBAというBasicが搭載されています。これはMicrosoftの開発言語のVBとほぼ同じことができるものです。
Excelの上で動かせるのでExcelの機能も簡単にアクセスできますし、家計簿のようなものを作るのであれば簡単にできると思います(完成度の高いものを望むのであれば難しいですが)。

投資額についてはExcelならたいていのメーカー製パソコンには最初からインストールされているのでゼロに近いですよね。

WindowsCEで動かしたいのであれば...Microsoftはホームページ上でeMbeded Visual Toolsというのを無料でダウンロードできるようにしています。これを使えばVisual C++もしくはVisual Basicで開発をすることができます。この2つの選択肢からでしたらVisual Basicをお勧めしますが...PDAはその必要性があまりないのでしたら初めは考えない方が無難だと思います。

Q外部スタイルシートで定義したスタイルの継承のようなものは可能でしょうか

外部スタイルシートで定義したスタイルの継承のようなものは可能でしょうか?


以下、例で説明すると、「main」スタイルを「sub1」と「sub2」が継承し、
「sub1」は「main」の「color」を継承し、「text-align」をオーバーライドしたい。
「sub2」は「main」の「text-align」を継承し、「color」をオーバーライドしたい。


【例 : 外部スタイルシート】
.main {
color : red;
text-align : center;
}

.main.sub1 {       ←実際はこのような指定ではできない
text-align : left;
}

.main.sub2 {       ←実際はこのような指定ではできない
color : blue;
}


【例 : htmlファイル】
<div class="sub1">あいうえお</div>  ←左寄せ&赤字にしたい
<div class="sub2">あいうえお</div>  ←センタリング&青字にしたい

外部スタイルシートで定義したスタイルの継承のようなものは可能でしょうか?


以下、例で説明すると、「main」スタイルを「sub1」と「sub2」が継承し、
「sub1」は「main」の「color」を継承し、「text-align」をオーバーライドしたい。
「sub2」は「main」の「text-align」を継承し、「color」をオーバーライドしたい。


【例 : 外部スタイルシート】
.main {
color : red;
text-align : center;
}

.main.sub1 {       ←実際はこのような指定ではできない
text-align : left;
}

...続きを読む

Aベストアンサー

#2です。

> .main.sub1 {       ←実際はこのような指定ではできない
一応、その書き方も有りです。
例えば、以下のように。

--------
<style type="text/css"><!--
.main { color: orange; text-align : center; }
.main.sub1 { color: blue; }
--></style>
</head>
<body>
<div class="main sub1">あいうえお</div>
--------


おすすめ情報