• ベストアンサー

特定の文字のみcssを適用するには？

いつもお知恵拝借しておりますm(_ _)m さて、最近cssをかじり始めたところなのですが、ページ中の特定の文字（例えば「愛」）という文字のみにフォントスタイルを適用することは可能でしょうか？ 現在は、「HTMLソース」の画面で「愛」という部分を「<font color="#cc0000">愛</font>」という風に置換させています。 これをcssで記述することが出来るかどうか？という質問です。 xp+ホームページビルダー10です。何とぞよろしくお願いします。

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

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

#2です。 無理ですね。。。 テキストエディタで、置換機能をつかって 特定の文字にスタイルあてはめ置きかえていくしかないです。

prairie-gentian
質問者

お礼

＞＞＞＞＞ #2です。 無理ですね。。。 テキストエディタで、置換機能をつかって 特定の文字にスタイルあてはめ置きかえていくしかないです ＞＞＞＞＞ そうですか(-_-) そんなうまい話はないんですよね。根が不精者なので、ついつい簡単な方法を求めてしまいます(^_^;) お手数をお掛けいたしました。ご回答感謝しますm(_ _)m

その他の回答 (3)

noname#54215
noname#54215
回答No.3

＞htmlソース上では何もマークしないで ＞htmlソースはいじらないで 残念ながら無理です。 HTMLはマークする言語です。マークするからスタイルをあてることができます。

prairie-gentian
質問者

お礼

＞＞htmlソース上では何もマークしないで ＞＞htmlソースはいじらないで ＞残念ながら無理です。 ＞HTMLはマークする言語です。マークするからスタイルをあてることができます そうですか(-_-) そんなうまい話はないんですよね。根が不精者なので、ついつい簡単な方法を求めてしまいます(^_^;) お手数をお掛けいたしました。ご回答感謝しますm(_ _)m

noname#64531
noname#64531
回答No.2

直接なら <span style="color:#cc0000">愛</span> クラス <span class="aka">愛</span>

prairie-gentian
質問者

補足

早速の回答、有難うございますm(_ _)m #1の方への補足でも書きましたように、htmlソースはいじらないで・・・という願望なんです。 大量のテキストを含むページなので、その中の特定の文字（例えば「愛」）という文字のみにcssでフォントスタイルを適用したいのです。 わがままな願いなんでしょうか(^_^;)

noname#54215
noname#54215
回答No.1

font colorは非推奨です…とまあそれはともかく。 <em>愛</em>などでemにスタイルをかければいいのでは？ <span class="～～"></span>の方が当たり障り無いですがソースが冗長に思えるし、目的が強調ならば、他で使っていなければ<em></em>がいいと思います。 それとももしかしてCSSでテキストの色替えをどうするかという質問でしたか？ それなら color:色指定 です。

prairie-gentian
質問者

補足

早速の回答、有難うございますm(_ _)m ＞ それとももしかしてCSSでテキストの色替えをどうするかという質問でしたか？ それなら color:色指定 です。 ＞ ソースの特定の文字(例えば「愛」)のみの文字色をcssで指定したいという希望なんですが・・・。もちろんhtmlソース上では何もマークしないで・・・という・・・。 素人ゆえの浅はかな願望なのでしょうか？

  1. カテゴリ
  2. パソコン・スマートフォン
  3. ソフトウェア
  4. ホームページ作成ソフト

関連するQ&A

  • かなり困ってます！CSSが適用されません…

    WindowsXPでDreamweaverMXを使っています。 body {font-size: 12px;} .px10 {font-size: 10px;} という内容の外部スタイル「css.css」を作り、テンプレートに「css.css」を適用しました テンプレートを元にページをつくり、部分的に <td class="px10">文字列</td> といった感じで適用しました。 Dreamweaver上ではちゃんと適用されているのですが、ブラウザでみてみると文字が小さくなっていません。 bodyの12pxはブラウザ上でもちゃんと適用されています。 何がいけないのか、わかりません。どなたか解かるかたがいたらお知恵をかしてください。

    • ベストアンサー
    • HTML
  • 特定の文字にCSSを適用したい

    ブログを書いております。 記事にコメントがあった時の「コメント（１）」といった表示を、コメントの有無で太字にしたりノーマル表示にしたいと思っています。 コメントが無いときは・・ コメント（０）をfont-weight:normal; とノーマル表示。 コメントが有るときは・・ コメント（１）をfont-weight:bold; とボールド表示させたいです。 Javascriptを使用して、特定の条件にのみCSSを適用するにはどうしたら良いでしょうか？ 宜しくお願いします。

  • IE用CSSが適用されない

    通常は12pxを指定して、IEのみフォントサイズを11px指定したいのです。 <!DOCTYPE HTML> <html lang="jp"> <head> <meta charset="UTF-8"> <title>タイトル</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta http-equiv="Content-Style-Type" content="text/css"> <!--[if IE]><link rel="stylesheet" type="text/css" href="css/ie.css"><![endif]--> <style> body { background-color:#FFFFFF; color:#333333; font: 'Lucida Grande', Verdana, Arial, 'Hiragino Kaku Gothic Pro', Meiryo, 'メイリオ', sans-serif; } #figure_main { font-size:12px; margin-top:10px; margin-left:10px; width:510px; } </style> </head> <body> <div id="figure_main"> <div class="box1"> <span>取締役会</span> </div> <div class="box1"> <span>取締役社長</span> </div> <div class="box2"> <span>常勤役員会</span> </div> <div> <ul> <li class="list_l">営業局</li> <li>人材派遣部</li> </ul> </div> </div> </body> </html> HTMLには<!--[if IE]>を記述し、 ie.cssには @charset "utf-8"; /* CSS Document */ #figure_main { font-size:11px; } と記述しましたが、適用されませんでした。適用されない理由を教えてくださいますか？ 宜しくお願いします。

    • ベストアンサー
    • HTML
  • 特定の画像リンクだけhover時の文字色を変更

    特定の画像リンクにだけスタイルを適用したいと思っています。 特定の画像リンクにクラス名“diet”と付けて、そのリンクにだけ hover 時の文字の色を赤色にしようと考えています。 その場合の記述の仕方を教えてください。 次のように記述しているのですが、うまくいきません。 HTMLに直接書き込む方法にしています。 <head> <style type=”text/css”> <!- a.diet :hover {color: red;} -> </style> </head> <body> <a href="アドレス"><img src=画像のアドレス></a> </body> （必要なところだけ抜粋しています） どこが間違っているのでしょうか？ 何度やってもうまくいません。 クラスの書き方がよくないのでしょうか？ できれば、HTMLに直接書き込む場合と、CSSを利用する場合の、２つの書き方を教えてください。 どうぞよろしくお願いします。

    • ベストアンサー
    • HTML
  • [Dreamweaver8]テンプレートに外部CSSを適用→HTMLドキュメントにCSSが適用されないのは何故？

    Dreamweaver8初心者で、現在勉強中の者です。 Dreamweaverのテンプレート機能を使った、外部CSSの設定方法についてお尋ねします。 ディレクトリは現在、以下のような状態です。 [サイト -SampleWebSiteFolder-] 　　　｜―[Templates] 　　　｜　　　｜―[style.css] 　　　｜　　　 Ｌ―[template.dwt] 　　　｜ 　　 　Ｌ[index.html] ※拡張子の無いものはフォルダを表します。 index.htmlファイルへCSSを適用させたいのですが、適用されないで困っています。 cssは、外部スタイルシートファイルを用意(style.css)し、テンプレート(template.dwt)に対して、CSSスタイルパネルの[スタイルシートを添付]ボタンより設定しています。 結果、テンプレート(template.dwt)に対してはCSSが適用されるのですが、HTMLドキュメント(index.html)にはCSSが適用されていない状態です。 テンプレートを用いて外部スタイルシートにてサイトを管理する場合、上記のケースにおける問題の原因は何でしょうか。 ちなみに、テンプレート[template.dwt]及び、HTMLドキュメント[index.html]の<head></head>内には、以下のソースが記述されています。 <link href="style.css" rel="stylesheet" type="text/css" />

  • HTML/CSSに変数のようなものはありますか？

    CSSで<p>タグ内の文字の色を設定しようと思ったら、設定したくない別の<p>タグ内の文字までその色になってしまい、それを直そうとしたら、HTML内に直接<font color="">と記述しなければならない…というのはなんとかならないのかと思って質問しました。 変数を定義できれば、HTMLにいちいち<font color="">と何度も入力せず、 a = <font color=""> <p>[a]～[/a]といった感じで簡単に記述できるので、楽だなーということです。

    • ベストアンサー
    • HTML
  • jQueryで特定のcssプロパティの値を書き換えたい

    jQueryで特定のcssプロパティの値を書き換えたい html上にインラインで記述しているスタイルのうち、特定のプロパティの値のみをjQueryで書き換えることはできますでしょうか。 具体的には↓ <span style="font-size: 16px;font-weight: bold;">テキスト1</span> <span style="color: #f00; font-size: 16px;">テキスト2</span>を <span style="font-size: 18px;font-weight: bold;">テキスト1</span> <span style=""color: #f00; font-size: 18px;">テキスト2</span>に style属性のfont-size: 16px;をfont-size: 18px;にしたい。 他は変えずそのままにしたい。 $(function() { $('span').filter(function() { return ($(this).css("font-size","16px")); }).css("font-size","18px") }); http://okwave.jp/qa/q5310183.html 似たような質問が上記でされていて、真似て書いてみたのですが、これだとfont-sizeが16pxでないものも全て18pxに書き換わってしまいました。 不勉強でお恥ずかしい限りですが、詳しい方いらっしゃいましたらどうかご教授ください。 よろしくお願いいたします。

  • 複数のテーブルのうち一つに外部CSSを適用したい

    　今HTMLファイルを作っているのですが、テーブルAの中にテーブルBが入っているとき、外部CSSをテーブルBだけに適用する方法はあるのでしょうか？　テーブルBのソースに直接スタイルを記述すれば一応出来るのですが、たくさんのファイルで同じスタイルを使用するので、出来れば共有できる外部ファイルで解決したいのです。分かる方がいらっしゃいましたら、ぜひ教えてください。

    • ベストアンサー
    • HTML
  • CSSでフォントが適用されない

    CSSでレイアウトを作成しました。 フォントはMS Pゴシックを指定しています。 CSSを外部にしましたらフォントがMS Pゴシックではなく、明朝っぽくなっています。他のCSSは適用されているのにフォントだけが適用されていません。 ※外部CSSにする前はMS Pゴシックになっています。 html ------------------------------------------------- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta http-equiv="Content-Style-Type" content="text/css" /> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <link href="style/style.css" rel="stylesheet" type="text/css" media="all"> <title>無題ドキュメント</title> ------------------------------------------------- 外部CSS ------------------------------------------------- @charset "utf-8"; html { height: 100%; } body { font-family:"ＭＳ Ｐゴシック", "Hiragino Kaku Gothic Pro W3", "ヒラギノ角ゴ Pro W3", "Osaka"; padding: 0px; margin: 0px; font-size: 0.8em; } ------------------------------------------------- どこが間違っておりますでしょうか？ 宜しくお願いします。

    • ベストアンサー
    • HTML
  • なぜ文字がでかくなってしまうのでしょうか？

    http://masaboo.cside.com/new_css1/cs_11.htmを見てるのですが ************************************** <HTML> <HEAD> <TITLE>サンプル</TITLE> <STYLE type="text/css"> <!-- H1 { color:red; } P { color:green; } --> </STYLE> </HEAD> <BODY> <H1>レベル1の見出しは赤色です。</H1> <P>段落は、緑色です。</P> </BODY> </HTML> ************************************** のサンプルの意味がよくわからないのですが、 なぜ、 H1 { color:red; } を宣言するだけで、文字がでかくなってしまうのでしょうか？ フォントサイズに関する記述がないのに、 赤文字が大きくなる理由を教えてください。

    • ベストアンサー
    • HTML

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

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

質問する