回答の文字色の修飾ができません。

ツールバーから文字色を選んでも、直接 <span style=...> で color を書き込んでも、
登録した回答に色が付きません。
HTML のソースを見ると、style 属性の内容が空文字列になってます。
再編集すると、指定した color は活きているので、データ自体は正しく登録されているようです。

Firefox 4 を使ってますが、これって、ぼくだけでしょうか?

因みに、ツールバーから色を選択したときに、一回目は正しく HTML タグが挿入されますが、
続けて二回目を行うと、タグの挿入すらされません。

回答の条件
  • 1人5回まで
  • 登録:
  • 終了:2011/07/08 22:36:39

ベストアンサー

id:meefla No.1

回答回数997ベストアンサー獲得回数472

無料質問なので、テストを兼ねて回答させていただきます。


この行は青い色。

(投稿前:<span style="color:#3300FF;">この行は青い色。</span>)


この行は赤い色。

(投稿前:<span style="color:#FF0000;">この行は赤い色。</span>)


この行は太字。


大きいフォント。


さらに大きいフォント。


投稿前の確認画面の時点で style 属性の内容が空文字列になっていて、色が付いていませんね。

人力のシステムが HTML のサニタイズでコケてる、に500クルゼーロ。

ツールバーからの二回目、は再現しませんでした。




追記です。(7月4日、午後11時25分)


この行は青い色。

(投稿前:<font color="blue">この行は青い色。</font>)


この行は赤い色。

(投稿前:<font color="red">この行は赤い色。</font>)


ご覧のように、font タグなら受け付けるようです。

リニューアル後の回答の

http://q.hatena.ne.jp/1308209951#a1078919

を見て気付きました。


ツールバーのカラーパレットが昔と変更されているようですので、

  1. ここで style 属性付きの span タグを入力するようにした。
  2. でも表示の時にはサニタイズされて色が付かない。

というオチではないかと考えます。

システムが改善されるまでは font タグの手打ち、が回避策でしょうか。

id:a-kuma3

色以外は、大丈夫っぽいんですね。


>ツールバーからの二回目、は再現しませんでした。

あれー、そうですか。

で、試しましたが、確かにできますね。

んー...


--

>人力のシステムが HTML のサニタイズでコケてる、に500クルゼーロ

文字サイズと bold の指定が、span タグの style 指定ですが、そこに color を指定すると、

表示用の HTML では、きっちり color の指定だけが消えます。


コケてる、というよりは、仕様を勘違いしているか、仕様を知らずに作った、という類の間違いなんじゃないか、という気がします。

2011/07/04 09:47:32

その他の回答4件)

id:meefla No.1

回答回数997ベストアンサー獲得回数472ここでベストアンサー

無料質問なので、テストを兼ねて回答させていただきます。


この行は青い色。

(投稿前:<span style="color:#3300FF;">この行は青い色。</span>)


この行は赤い色。

(投稿前:<span style="color:#FF0000;">この行は赤い色。</span>)


この行は太字。


大きいフォント。


さらに大きいフォント。


投稿前の確認画面の時点で style 属性の内容が空文字列になっていて、色が付いていませんね。

人力のシステムが HTML のサニタイズでコケてる、に500クルゼーロ。

ツールバーからの二回目、は再現しませんでした。




追記です。(7月4日、午後11時25分)


この行は青い色。

(投稿前:<font color="blue">この行は青い色。</font>)


この行は赤い色。

(投稿前:<font color="red">この行は赤い色。</font>)


ご覧のように、font タグなら受け付けるようです。

リニューアル後の回答の

http://q.hatena.ne.jp/1308209951#a1078919

を見て気付きました。


ツールバーのカラーパレットが昔と変更されているようですので、

  1. ここで style 属性付きの span タグを入力するようにした。
  2. でも表示の時にはサニタイズされて色が付かない。

というオチではないかと考えます。

システムが改善されるまでは font タグの手打ち、が回避策でしょうか。

id:a-kuma3

色以外は、大丈夫っぽいんですね。


>ツールバーからの二回目、は再現しませんでした。

あれー、そうですか。

で、試しましたが、確かにできますね。

んー...


--

>人力のシステムが HTML のサニタイズでコケてる、に500クルゼーロ

文字サイズと bold の指定が、span タグの style 指定ですが、そこに color を指定すると、

表示用の HTML では、きっちり color の指定だけが消えます。


コケてる、というよりは、仕様を勘違いしているか、仕様を知らずに作った、という類の間違いなんじゃないか、という気がします。

2011/07/04 09:47:32
id:fut573 No.2

回答回数196ベストアンサー獲得回数55

firefox

Chorome

IEで再現

IEでカラー選択をしようとすると

f:id:fut573:20110703223140p:image

こんなことになって、span styleさえ挿入できませんでした。

id:a-kuma3

データは保存されてるっぽいので、表示するときのサーバーサイドの処理の問題っぽいですよね。


色を指定するときの javascript については、IE については視野に入って無いんだろうな、という感じは、

人力検索の回答欄についてだけではないですよね。

2011/07/03 22:45:24
id:papavolvol No.3

回答回数1078ベストアンサー獲得回数199

無料質問なので、回答欄から失礼します。

 

私もFirefox 4を使用していました。今はFirefox 5を使用しています。

「ツールバーから色を選択したときに、一回目は正しく HTML タグが挿入されますが、続けて二回目を行うと、タグの挿入すらされません。」

と同じ原因ではないかと思うのですが:

回答にurlリンクをつけるときに、ツールバーからつけると、1つめのリンクはちゃんと付くのですが、文中に2つ目以降のurlリンクは付けられません。

最初につけたリンクとごちゃっと崩れてしまうようです。

はてなの回答画面の、Firefox仕様がそうなっているのだと思います。 

 

id:a-kuma3

まだ FF4 ですが、リンクのツールバーはきちんと動作するみたい。

IE を捨てるのは、気持ちとして分からなくは無いけれど、だったら FF や Safari、Chrome などには、「仕様」という逃げを打たず、きちんと対応して欲しいところ。


自分の仕事でもそうですが、実装前に「やらないよ」と言ってない動作について、「仕様だ」というのは、逃げでしかありません。


# まるで、id:papavolvol さんを攻撃してるみたいな文章になってしまいました m(_ _)m

2011/07/04 23:59:54
id:pacochi No.4

回答回数247ベストアンサー獲得回数113

ほぼ毎回回答に色付けをほどこす回答者さんの回答履歴を覗かせていただいたところ、6月 11日頃まではカラフルだったのですが、それ以降は色成分がカットされているみたいです。

11日には私も text-decoration プロパティなんかを使っていた (ソース参照) のですが、後日別の回答で使おうとしたら、使えなくなっていました。


ちょっと気になるので、どんな CSS プロパティが使えるかちょいちょい試してみました。

他の回答者さんも既に書かれていますが、font-size, font-weight, font-style は使えますね。

あとは text-align と、何故か width だけ使えました。割と色々試してみましたが、他は全滅です。

width, text-align


気になるついでに、font 要素とは別路線で色付けの方法を模索してきました。

newquestion.css に、思いっきり色付け用途っぽいセレクタがあったので、書き出しておきます。

  • .black
  • .gray
  • .blue
  • .navy
  • .green
  • .red

こんな感じで書いてます。

-<span class="black">.black</span>
-<span class="gray">.gray</span>
-<span class="blue">.blue</span>
-<span class="navy">.navy</span>
-<span class="green">.green</span>
-<span class="red">.red</span>

ついでのついでに色付けに応用できそうなセレクタも見繕ってはみましたが、こちらは色付け用途で使うのはちょっと危なっかしいかも。一応書き出しておきます。

  • strong.attention
  • .note
  • .timestamp
  • .domain
  • .range
  • .users
  • .entry
  • .pager .squeeze
  • .answer
  • span.retweet-text

あ、質問文に沿った回答を書くのを忘れていました。

私も Firefox 4 (がベースのブラウザ) を使っていますので、a-kuma3 さんだけではありません、という事になります。


それと、ツールバーの挙動はまだ調べていません。

(「お絵かき」がブラウザによっては動作しないことだけ確認しました。)

id:a-kuma3

width, text-align が、変なところに飛び出てる、と思ったら、

ちょいちょい試した結果だったんですね。


色をつけるだけのクラスがあったのは、ちょっと盲点だったな。

2011/07/05 12:05:41
id:meefla No.5

回答回数997ベストアンサー獲得回数472

idea:30015 が速攻で実装済みになりました。

style 属性付きの span タグでも、文字色が装飾できるようになっているようです。


この行は青い色。

(投稿前:<span style="color:#0000FF;">この行は青い色。</span>)


この行は赤い色。

(投稿前:<span style="color:#FF0000;">この行は赤い色。</span>)


私の最初のテストでも、再編集するとプレビューで色が付く事を確認してます。

色が付かなかったという証拠が消えてしまうので(^^;

追記ではなく二回目の回答で。

id:a-kuma3

修正が早かったっすね。

めでたし、めでたし。

2011/07/08 22:35:44
  • id:meefla
    回答に追記しました。
    font タグなら受け付けるようです。
  • id:a-kuma3
    >font タグなら受け付けるようです。

    本当っすねー。
    font タグの color 属性はいけますね。
    試しに、font タグで、style 属性で color を指定してみましたが、きれいに削除してくれます。

    とりあえず、「回答に色を付けたい」という意味では、解決しちゃったかな。
  • id:meefla
    はてなアイデアに登録してみました。
    http://i.hatena.ne.jp/idea/30015

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

回答リクエストを送信したユーザーはいません