プロが教えるわが家の防犯対策術！

TABLEのセルの中の文字を行単位、セル単位で色を変えたい

解決済

  • 質問者：urizaka
  • 質問日時：
  • 回答数：4件

urizakaです
さて、質問なのですが、<TABLE>の中のセル<TD>の中に入れる文字の
色を変えることってできるんでしょうか？
それも、行単位とかセル単位という細かい単位で…
javaScriptを使うとできそうな気もしますが…
すみませんが、この件についてご存知の方宜しくお願いします。

通報する

この質問への回答は締め切られました。

質問の本文を隠す

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

「表 16進数」に関するQ&A： 03分22秒36のような時間の単位を16進数で表すと、どうなりますか？

さらに表示

「JavaScript 文字」に関するQ&A： javascriptで文字の拡大、縮小

A 回答 (4件)

No.3ベストアンサー

  • 回答者： novaakira
  • 回答日時：

javaScriptでなくてもできます。



<table>
<tr bgcolor="silver"> ・・・ここでセルの色を指定
<td><font color=blue>ためし１</font>　・・・ここでセル内の文字の色を指定
</td></tr>
</table>

のようにすればセル単位での設定ができます。
また、このテーブルを真ん中におきたい場合は、
<table align="center">
とすればいいし、ボーダーを消すのなら
<table border="0">
とすればいい。
また、
<table border="0" align="center" cellpadding="0" cellspacing="0"
とすればボーダーもなく、真ん中にあり、しかもセル全部が
くっついているテーブルになる。

リンクを指定したい場合は

<tr align="center" bgcolor="#6f9fff">
<td><A HREF="****"><font size="2" color="red">お知らせ</font></A>
</td></tr>

と書けばいい。

bgcolorとfontcolorは１６進数で表してもいいし、色の名前を
そのまま指定してもいいはず。色は COLOR CHART を検索して見つけて
ください。
    • good
    • 0
    • 件
通報する

No.4

  • 回答者： next-co
  • 回答日時：

スタイルシートでできます。


ただしNNの場合は、<P>タグに指定したほうが安全です。

<style>
<!--
td.a { color: red }
td.b { color: blue }
-->
</style>

<table>
<tr>
<td class="a">
<p>aaaaa</p>
<td cloass="b">
<p>bbbbb</p>
</td>
</tr>
</table>
    • good
    • 2
    • 件
通報する

No.2

  • 回答者： inoue64
  • 回答日時：

セル単位で指定する方法


<table>
<tr>
<td><font color=色指定>あああ</font>
<td>いいい
</table>
    • good
    • 0
    • 件
通報する

No.1

  • 回答者： a-kuma
  • 回答日時：

固定で良いんだったら <TD> のスタイルでセル単位の色が指定できます。



<table>
<tr>
<td style="color:red">aaaaa
<td>bbbbb
</table>

もちろん、スタイルシートの方で設定して class を設定してもOKです。
    • good
    • 0
    • 件
通報する

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

「表 16進数」に関するQ&A： 特殊漢字「はし」（橋のつくりの上部が有）の見つけ方

さらに表示

「JavaScript 文字」に関するQ&A： confirm の　OK、キャンセル　以外の文字を

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

Q質問する（無料）

このQ&Aを見た人はこんなQ&Aも見ています

関連するQ&A

関連するカテゴリからQ&Aを探す

専門家回答数ランキング

専門家

※過去一週間分の回答数ランキングです。

Q質問する（無料）

他の専門家の回答をチェック

このQ&Aを見た人が検索しているワード

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

Qテーブル内の文字サイズを変更したい。

HTMLのテーブル内の文字サイズを変更したいのですが。
イマイチ上手くいかずに悩んでいます。
出来れば全体的に<TABLE></TABLE>のほうでいじれますか？
<TD>タグや<TR>タグのところでいじくるのですか？

Aベストアンサー

いろいろやり方はありますが
文字単位でサイズを変更するには
＃2の方法ですね。

テーブルごとやセル（<TD>）ごとにサイズを変更するには
スタイルシート（CSS）を使用します。

テーブルごとにサイズを変更する場合
<TABLE style="font-size : 20px;">

セル（<TD>）ごとにサイズを変更する場合
<TD style="font-size : 20px;">あああ</TD>

＃1の方法だとページ内の全てのセル（<TD>）に設定することになります。

スタイルシート（CSS）はこれら以外にも
いろいろな設定方法があります。

他の回答も見る

Q一つのテーブル内の文字色だけを指定したい。

ページの他の文字や、他のテーブルの文字色は変えずに、
そのテーブルだけ一括して文字の色を指定したいのですが、うまくいきません。

<TD><Font color=>で個別にやるのが面倒なもんで、
どなたか教えて下さい。

Aベストアンサー

スタイルシートで指定すればよいと思います。

<HEAD>

<STYLE type="text/css">
<!--
.Class{
color : red;
}
.stylename{
color : aqua;
}
-->
</STYLE>
</HEAD>
<BODY>
<TABLE class="stylename">
<TBODY>
<TR>
<TD >ああああ</TD>
<TD >いいいい</TD>
</TR>
</TBODY>
</TABLE>


※stylenameはお好きなものを。

他の回答も見る

QHTMLフォームのSELECTの幅を一定にするためには？

HTMLフォームのSELECTの幅を一定にするためにはどのようにすれば
いいのでしょうか？

CSS等で設定できるとありがたいのですが、やり方がわかりません。

Aベストアンサー

<select style="width: 200px">

他の回答も見る

Qテーブル内の文字列を改行させたい

<TABLE border="1">
<tr> <TD>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</TD>
</tr>
</TABLE>

これを、ある一定の幅を指定して改行させたいのですが、
CSSを使おうが使わず指定しようが、反映されません。
全角文字だと反映されます。

IE6、IE7で対応させたいと思っています。

CSSでも何でも良いので、どうすれば対応出来るのか
ご教示下さい。

Aベストアンサー

英数半角文字だと、続けて入力した場合、一つの単語とみなして禁則処理をしてしまうんだと思います。
なので、<br>で改行するのがいいのかと思いますが、
IEで対応したいということなので、IE7で動作するかはわかりませんが、
word-break:break-all;
の指示で単語の切れ目を無視して改行してくれると思います。

参考URL：http://www.htmq.com/style/word-break.shtml

他の回答も見る

Q特定内の
の色を変える

お世話になります。
特定<table>内の<td>の色を変える
<table id="abc">
<tr>
<td>あああああ</td>
<td>いいい</td>
<td>ううう</td>
</tr>
</table>
<table>にはidを定義します。
その<td>タグにはidを定義していません。
このとき、あああああ、いいい、うううの表示色を
<input type="button" value="色を変える" onClick="ChngColor()">

なんてことで、
マウスをクリックすることにより変更できないものでしょうか。
よろしくお願いいたします。

Aベストアンサー

#1さんへの補足より――

> functio ChngColor(){
> var Obj=document.getElementById('abc');
> Obj=document.getElementsByTagName("td");
> for (var i=0;i<Obj.length;i++){
> Obj.style.color="red";
> }
> }

特に3行目がいけない。こう変えましょう。
（あと、詰めすぎは見づらいので、適当に空白を入れました）

function ChngColor() {
var Obj1 = document.getElementById('abc');
var Obj2 = Obj1.getElementsByTagName("td");
for (var i = 0; i < Obj2.length; i++) {
Obj2[i].style.color = "red";
}
}

他の回答も見る

Qテーブル内の一部のみ線を変更する方法ってありますか？

いつもお世話になっております。どなたか教えて下さい。
無理なら無理で結構ですので不可能だと回答下さい。

あるテーブル内の一部のみ線を点線にしたり、線幅を細くする方法があれば教えてほしいのですが・・・可能でしょうか？

イメージはエクセルのように一部の罫線だけを変更したいのです。宜しく御願いします。

１つのテーブルで実現不能ならば、複数のテーブルを自由に結合する方法とかないでしょうか？

むちゃくちゃ言って申し訳ありませんが、どなたか救いの手をお願いします。

ちなみにブラウザはIE5.0か6.0だと思います。

Aベストアンサー

スタイルシートを用いることで可能です。
以下の例ではタグに直接style属性を埋め込んでいますが、
先にstyle指定をしておくと楽かもしれません。
<table border="1" bordercolor="black">
<tr>
<td style="border-top-style:dashed;border-left:3px solid red;border-bottom-width:2px;border-right-color:blue;">あああ</td>
</tr>
</table>
詳しくは、スタイルシート、CSSなどで調べてみてください。

他の回答も見る

Qテーブルセル余白（例えば左側だけ、上側だけ、など）

こんにちは。
宜しくお願いいたします。

テーブル内のコードに、cellpadding="5" は
セル余白が上下左右のすべて、5ピクセル空きますが、

左側だけ5ピクセル、とか、上側だけ５ピクセル、のように
指定方向のみ、余白を作ることは可能でしょうか。

その場合のHTML記述を教えてください。

また、ここで質問させていただいている「指定方向への余白指定」と
全体余白指定の「cellpadding="ＸＸ"」は同時に使って
良いものでしょうか。
素人質問ですみません。
宜しくお願いいたします。

Aベストアンサー

１つのセルだけなら、下記で。
<td style="padding: 5px 10px 20px 30px;">
上の例は、上が 5px。 右が 10px。下が 20px。 左が 30px。
適当に数値変更してください。
cellpadding="5" と style="padding: 5px;"は同じになるはず。
<td style="padding: 5px;">

両方使うとどうなるかは、試して下さい。
cellpadding をここ数年利用していないので・・・

複数個所利用するなら、NO.1さんを参考に HEAD内に下記を入れて試してみましょう。
<style type="text/css">
<!--
td {padding: 5px 10px 20px 30px;}
-->
</style>

他の回答も見る

QHTMLでテーブルを横に並べる方法

HTMLでホームページを作っています。
テーブルを横に二つ並べたいのですが、二つ目のテーブルはどうしても最初のテーブルの下の段になってしまいます。どうしたら横に並べることができますか？
教えていただければ幸いです。
よろしくお願いします。

Aベストアンサー

２列のテーブルを作ったらいかがでしょうか？
<table>
<tr>
<td>１つめのテーブルに入れる内容</td>
<td>２つめのテーブルに入れる内容</td>
</tr>
</table>

それぞれのテーブルをそのまま使いたいならば、
↑のテーブルのセルの中に、それぞれ入れれば２つ並びます。
<table>
<tr>
<td><table>←１つめのテーブル→</table></td>
<td><table>←２つめのテーブル→</table></td>
</tr>
</table>

他の回答も見る

Qで文字を右揃えにしたいのですが...(＾-＾；

こんばんは。私は今HPを作っています。
それで質問なんですけど、
HTMLで<SPAN>ってタグありますよね？
それにCSSを使って(? <SPAN>で囲まれた場所を
文字を右揃えに表示させたいのですが、何故かうまくいきません。
<SPAN style="text-align: right">○○</SPAN>
このようなタグで使いました(上)
何故なのでしょう、教えてください。
よろしくお願いします。

ちなみに、このようなものをつくりたいのです。(下)
リンク集なんですけど；

HPタイトル 　　管理者名
―――――――――――――――
バナー
―――――――――――――――
このHPの説明

これの管理者名のところを右揃えに表示したいのだが、
うまくいかないのです；<DIV>だと改行されてしまうし...

Aベストアンサー

span要素に対しては、text-alignの指定は有効にならないと思います。 こういった場合、positionプロパティを指定してポジショニングするか、floatプロパティで回り込みをさせるのが良いと思います。
CSSに頼らない方法をとっても良いなら、テーブルでレイアウトするのも手でしょう。

スタイルシートで処理する場合のソースの書き方ですが、以下のようにしてみてはいかがでしょうか。

<div>
<span style="float: right;">管理者名</span>HPタイトル
<hr style="clear: right;">
<img src="*" alt="バナー">
<hr>
<p>このHPの説明</p>
</div>

こうすると、お望みどおりになるのではないかと思います。 なお、「<span style="float: right;">管理者名</span>」これは、回り込みさせるテキストの前、この場合はHPタイトルの前に入れてください。 HPタイトルの後ろに入れてしまうと、管理者名が一段下にずれて表示されると思います。

参考になれば幸いです。

span要素に対しては、text-alignの指定は有効にならないと思います。 こういった場合、positionプロパティを指定してポジショニングするか、floatプロパティで回り込みをさせるのが良いと思います。
CSSに頼らない方法をとっても良いなら、テーブルでレイアウトするのも手でしょう。

スタイルシートで処理する場合のソースの書き方ですが、以下のようにしてみてはいかがでしょうか。

<div>
<span style="float: right;">管理者名</span>HPタイトル
<hr style="clear: right;">
<img src="*" alt="バナー...続きを読む

他の回答も見る

Q
内のFONT指定について。

<table></table>内のFONT指定で、毎回
<font size=2>をセルごとに入れていますが、セルの数が多く、サイトの負担が大きくなります。
tableごと、あるいは、ページごとに一括で指定はできないのでしょうか。
スタイルシートは、あまりなじみがありません。

よろしくお願いします。

Aベストアンサー

こんにちは


table要素全体に文字を調節する場合は、

　head要素に
<meta http-equiv="Content-Style-Type" content="text/css">
<link rel="stylesheet" href="style.css">
を追加します。

　table要素に
class="(1)"を追加します。
<table class="(1)">
(1)に適当な名前をつけてください。
/////////////////////////////////////////////
テキストエディタで、新しくファイルを作成して、
font-size: (2)

(2)にはフォントサイズを入れます。数字だけの指定はできません。おすすめはem単位です。現在のフォントの大きさを基準として、大きさを決めます。たとえば、2倍大きくしたいのならば、2emと書きます。

と書いて、HTMLファイルがあるフォルダに、style.cssとタイトルをつけて保存します。

/////////////////////////////////////////////

CSSについて、わかりやすいホームページは
http://www6.plala.or.jp/go_west/beginner/css/
1と2の間辺りからはじめるCSS講座
は、楽しいと思います。

こんにちは


table要素全体に文字を調節する場合は、

　head要素に
<meta http-equiv="Content-Style-Type" content="text/css">
<link rel="stylesheet" href="style.css">
を追加します。

　table要素に
class="(1)"を追加します。
<table class="(1)">
(1)に適当な名前をつけてください。
/////////////////////////////////////////////
テキストエディタで、新しくファイルを作成して、
font-size: (2)

(2)にはフォントサイズを入れます。数字だけの指定はできません。おすすめはem単...続きを読む

他の回答も見る
ページトップページトップ

Q質問する（無料）

このQ&Aを見た人がよく見るQ&A

人気Q&Aランキング

おすすめ情報