初めての店舗開業を成功させよう>>

いつもお世話になります。
取消し線を赤色にしたいのですが、可能でしょうか。

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

A 回答 (1件)

HTMLではstrike要素は非推奨なので、CSSで話をします。



CSSの規格書でtext-decorationのところを読むと、対象となる要素
のcolor属性の色で描画しろと書いてあります。赤いテキストなら赤
い打ち消し線になるわけですね。それでよければ話はここでおしま
いです。

では、文字は黒で打ち消し線だけ赤くしたいときはどうすればいい
でしょうか。規格書の同じ段落には続いて、子要素が違うcolor属性
を持っても装飾の色は変わらず一貫しているべきだと書いてありま
す。ということは、打ち消し線を指定した直後にspan要素を入れ子
にしてテキストの色を戻してやればいいはずです。たとえば

<p>ここは通常の文字列で、<span style="text-decoration:line-
through;color:red;"><span style="color:black;">打ち消し線を書
いて、</span></span>元どおりの文字列</p>

こんな感じ。

参考URL:http://www.w3.org/TR/CSS21/text.html#decoration
    • good
    • 1
この回答へのお礼

お~!!できました。こんな裏技があるんですねっ。
ありがとうございます。

お礼日時:2007/11/26 13:13

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

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

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

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

QWORD:二重取消線の線の色のみの変更

まさに、タイトル通りです。
二重取消線の線の色だけを変更したいのですが、
文字の色も一緒に変更されるため、困っています。

方法をいろいろ探したのですが、二重取消線の引き方はたくさん載っているのですが、その色のみの変更は出来ないのでしょうか???

どなたか分かる方教えて下さい。
よろしくお願いします。

Aベストアンサー

オートシェイプでの訂正線(取り消し線)が簡単で良いとは思いますが、
フィールドコードを使用しても出来ますよ。
ちなみに[オートシェイプの書式設定]で[直線]の線を二重線に変更する
ことが出来ますから簡単ですよね。

ただし初期状態のオートシェイプは、訂正したい文字列とは一緒に移動
しませんし、アンカーを固定する方法で対応しても、行をまたぐ場合に
中途半端になり易いですよね。どの方法も色を付けるとなると、難しい
設定になるのはしかたがないかな。
とりあえず、こういう方法↓もあるということで。

取り消し線に色をつける
http://hamachan4.exblog.jp/3211842/

上記の方法は、単なる取り消し線だけなので、二重取り消し線に変更を
するには少し裏技が必要です。

訂正したい範囲を選択して、[ Ctrl+F9 ]キーでフィールドコードを入力
出来るようにします。(仮の名前として「訂正文字」とします)

{ 訂正文字 }になったら、文字列の前後に半角括弧を付け、文字列の後ろ
にカンマをつけます。
{ (訂正文字,) }になったら、Eqフィールドとスイッチを付けます。
-------------------------------------------
※文字のフォント名が等幅フォントの場合
{ eq \o\ac(訂正文字,) }にして、訂正文字の後のカンマの次にスペース
を入れます。
{ eq \o\ac(訂正文字,□□□□) } (□は全角スペース)

「□□□□」を選択し、[フォント]の二重取り消し線の設定をします。[フォント]の[色]を[赤]にします。
-------------------------------------------
※文字のフォント名がプロポーショナルフォントの場合

{ eq \o\ac(訂正文字,) }にして、訂正文字の後のカンマの次にスペースを入れます。
{ eq \o\ac(訂正文字,□) } (□はスペース)

「□」を選択し、[フォント]の[色]を[赤]にし二重取り消し線を設定します。
この「□」を[倍率]で横幅を広く設定します。[倍率]の範囲では足りない
場合は、「□」を追加して、追加した「□」のも二重取り消し線を設定し、
[倍率]をしていします。訂正文字と同じ幅になったらフィールドコード
を非表示にすれば出来ます。
面倒な方法ですがこのような方法もあるということで覚えておくと便利
ですし、様々な活用方法があります。

オートシェイプでの訂正線(取り消し線)が簡単で良いとは思いますが、
フィールドコードを使用しても出来ますよ。
ちなみに[オートシェイプの書式設定]で[直線]の線を二重線に変更する
ことが出来ますから簡単ですよね。

ただし初期状態のオートシェイプは、訂正したい文字列とは一緒に移動
しませんし、アンカーを固定する方法で対応しても、行をまたぐ場合に
中途半端になり易いですよね。どの方法も色を付けるとなると、難しい
設定になるのはしかたがないかな。
とりあえず、こういう方法↓もあるとい...続きを読む

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テーブル内の文字サイズを変更したい。

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

Aベストアンサー

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

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

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

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

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

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

QCSSでborderの長さを指定、または可変にしたい。

下記のように指定していますが、これだと横幅いっぱいに下の線が表示されてしまいます。

文字なりの長さ、または指定のピクセル数にしたいのですが、どのようにしたらよいでしょうか。

h3{
border-width : 0px 0px 1px 5px;
border-style : solid ;
border-color : #FF3333;
padding-left : 5px;
}

Aベストアンサー

borderの長さはそのボックスの大きさですから、ボックスの大きさを指定する事になります。
h3{
width:???px;
border-width : 0px 0px 1px 5px;
border-style : solid ;
border-color : #FF3333;
padding-left : 5px;
}

また、文字数(ボックスの内容)に合わせたい場合は、ボックスを浮動化(float)する等の方法もありますが・・・そのボックスの周りへ影響が出たり、ブラウザ毎にバグや実装の違いなどが比較的多く、扱いが面倒になるのであまりおすすめできません。

HTMLの方も修正する方法でもよければ

<h3><span>××○○</span></h3>
のようにspanで囲い、スタイルをspanに対して指定する方法もあります。

h3 span{
border-width : 0px 0px 1px 5px;
border-style : solid ;
border-color : #FF3333;
padding-left : 5px;
}

borderの長さはそのボックスの大きさですから、ボックスの大きさを指定する事になります。
h3{
width:???px;
border-width : 0px 0px 1px 5px;
border-style : solid ;
border-color : #FF3333;
padding-left : 5px;
}

また、文字数(ボックスの内容)に合わせたい場合は、ボックスを浮動化(float)する等の方法もありますが・・・そのボックスの周りへ影響が出たり、ブラウザ毎にバグや実装の違いなどが比較的多く、扱いが面倒になるのであまりおすすめできません。

HTMLの方も修正する方法でもよけ...続きを読む

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

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

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

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

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

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

Aベストアンサー

1つのセルだけなら、下記で。
<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>

Qリンクの下線の色を変えると下線が下付きになってしまいます。

リンクの下線の色を変えると
下線が下付きになってしまうのですが
間隔を、色を変更する前と同じにするには
どうしたらよいのでしょうか。
よろしくお願いいたします。


<body link="#ff99ff" vlink="#ff99ff" alink="#ff99ff">
<a href="" style="border-bottom: 1px #999999 solid;text-decoration:none;">説明(1)<br>説明(2)</a><br><br>

<body link="#ff99ff" vlink="#ff99ff" alink="#ff99ff">
<a href="">説明(1)<br>説明(2)</a></div>

Aベストアンサー

> リンクの下線の色を変えると

違いますね。A要素のボーダーを描いたんです。文字列の下線は、
text-decorationのunderlineです。わざわざ消していますね。

要するに文字色と下線の色に違う色を使いたいんですよね。では
参考URLの応用でいけます。<a href="" style="color:#999999;
text-decoration:underline;"><span style="color:#ff99ff;">
説明(1)<br>説明(2)</span></a>こんな雰囲気で。

参考URL:http://oshiete1.goo.ne.jp/qa3547767.html

QHTMLからフォルダを開きたい

いつも大変お世話になります<(_ _)>

Webサーバー上にあるWebページ(HTML)の中に、ローカルPCのフォルダを開くリンクを付けたいのですが、
<a href="file://c:\windows">OPEN</a>
としても、何も反応しません。

いろいろ調べたのですが、上記の方法しか見あたりません。

なお、ブラウザのアドレス欄に file://c:\windows と入力すると、フォルダの内容が表示されます。
※Firefoxだと、ファイルの一覧になりますが・・・

何か環境によって挙動が異なるのでしょうか?
それとも、セキュリティ上の観点から最近じゃ出来なくなっているのでしょうか?

是非ともお助け下さい。宜しくお願い致します。

Aベストアンサー

file:///C:/windows/
/は三つでは・・・
 IEの場合はエクスプローラ(ファイルマネージャ)が開くような・・・
 IEはファイルマネージャーと一体のブラウザなので・・・

★実は、ローカルサーバーが必要です。
 apacheでも何でも良いので、WEBデータの入っているフォルダーを
<VIRTUALHOST 127.0.0.1>
C:\Document and settings\my document\web
 とかに指定して、Windowsのhostsファイルで、適当なサーバー名を指定しておきます。
myLocalhost 127.0.0.1
とか・・・

 そうすると
http://myLoclahost/
 で開けます。

 

Q配列をPOSTで受けとる

タイトルのまんまですが
配列をformで送って
それをPOSTで受け取りたいのですが
うまくいきません

具体的に言うと
<?php
print"<form method=POST action=action.php>";

for($i=0; $i<$n; $i++){
   print"<input type=text name=foo[$i]>";
}
print"<input type=hidden name=n value=$n>";
print"<input type=submit value=go>";
print"<form>";
?>


///////////以下action.php//////////////////
<?php
$n = $_POST["n"];
for($j=0; $j<$n; $j++){
   $foo[$j] = $_POST["foo[$j]"];
   print"$foo[$j]";
}
?>


こんな感じのことがしたいのですが
うまくいきません
どうもPOSTされてないみたいでfoo[$j]はnullです
凡ミスな気がしなくもないんですが...プログラム初心者なんで↓↓
教えてください
よろしくお願いします

タイトルのまんまですが
配列をformで送って
それをPOSTで受け取りたいのですが
うまくいきません

具体的に言うと
<?php
print"<form method=POST action=action.php>";

for($i=0; $i<$n; $i++){
   print"<input type=text name=foo[$i]>";
}
print"<input type=hidden name=n value=$n>";
print"<input type=submit value=go>";
print"<form>";
?>


///////////以下action.php//////////////////
<?php
$n = $_POST["n"];
for($j=0; $j<$n; $j++){
   $foo[$j] = $_POST["foo[$j...続きを読む

Aベストアンサー

atsuGTさんこんにちは。


受け取り側は

$foo = $_POST["foo"];

とするだけで$fooに送信された配列が格納されます。


$_POST["foo[添え字]"] ではなく、
$_POST["foo"][添え字] となります。

QCSSでボックス幅を文字列に合わせたい

ボックス幅を文字列の幅に合わせるにはどうしたらいいのでしょうか。
テーブルではセルにwidth属性を指定しなくても文字列の幅になりますが、ボックスではwidthプロパティを指定しなかったら領域全体の幅になります。white-spaceプロパティでnowrap指定し、widthプロパティで文字列より小さいサイズに指定するとできるのですが、他に指定する方法があれば教えて下さい。

Aベストアンサー

div等のblock要素ではなくspan等のinline要素によって行う。

<span style="border:solid 1px">文字幅に合わせた枠線</span>

Qテキストボックスに数字しか入力できないようにするには?

タイトルの通りなのですが、あるテキストボックスに数字しか入力できないようにしたいのですが可能でしょうか?また、

「あいうえお 12345 「」:・、¥・」

というような文字列をコピーし、そのテキストボックスにペーストした際にも数字の12345だけが残るといった事も実現したいのですが…

どなたかご存知の方いらっしゃいましたら教えて頂けると幸いです。

Aベストアンサー

>英数字

では、こんな感じで

<input type="text" onKeyup="this.value=this.value.replace(/[^0-9a-z]+/i,'')">


人気Q&Aランキング

おすすめ情報