- ベストアンサー
span 前後に半角の空白が入るのですが
1<span class="test">2</span>3 とすると、2の前後に半角の空白が入るのですが、 これを入らないようにする方法はありますか？ スタイルシートは、 span.test{ color: red; } としています。
- SLRRNLPADBVM
- お礼率97% (40/41)
- CSS
- 回答数2
- ありがとう数2
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
- ベストアンサー
その他の回答 (1)
- t_ohta
- ベストアンサー率38% (5099/13331)
1の後ろと3の前に改行が入ってませんか？
お礼
ありがとうございました。
関連するQ&A
- CSS:span 改行させるには？
こんにちは。 以下のようなHTMLがあります。 HTMLは自動生成のため編集不可なのですが、スタイルシートのみ編集可能です。 <span class="price">4,500円 </span><span class="price2">税込、送料別</span> 現在はそれぞれ、スタイルシートに フォントカラーサイズ程度が与えられているだけなので 4,500円 税込、送料別 と表示されています。 これを価格のあとで改行させて 4,500円 税込、送料別 と表示にさせることはできないでしょうか。 よろしくお願いいたします。
- ベストアンサー
- その他([技術者向] コンピューター)
- spanタグ 無視される
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>sample</title> <style type="text/css"> span.test{ padding: 6px 0px; background-color: gainsboro; text-align:center; border: 1px gray solid; margin-top:10px; margin-bottom:8px; color: gray; width: 100px; } </style> </head> <body> <span class="test"> <a href="#A"> A</a> </span> <br> <span class="test"> <a href="#B"> B</a> </span> </body> </html> ------------------------- というソースで spanタグで padding: margin-top:10px; margin-bottom:8px; width: が無視されてしまうのですが なぜでしょう？ 更に画像のように文字が重なってしまいます。 padding: margin-top:10px; margin-bottom:8px; width: これらを適用させるにはどうすればいいでしょうか？ AとBは隣同士に表示したいため、divではなく、spanを使用しました。
- ベストアンサー
- HTML
- 次のhtml・cssでspan内の文字を点滅させる
次のhtml・cssでspan内の文字を点滅させるには、どのようにしたらよいのでしょうか。 但し、テスト1が表示されている間は、テスト2と3は消えており、 テスト2、3が表示されている間はテスト1が消えている状態にしたいです。 なぜか、反復の意味を持つdurationタグの後ろに連結して、duration:blinkはできませんでした。 <div class="test"> <span class="brinking1">テスト1</span> <span class="brinking2">テスト2</span> <span class="brinking3">テスト3</span> </div> <style> .test { margin: auto; background-color: white; position: relative; } .test blinking { width: 50%; animation-name: test; -webkit-animation-name: test; animation-duration:blink 10s; -webkit-animation-duration: 10s; animation-iteration-count: infinite; -webkit-animation-iteration-count: infinite; opacity: 0;} .test .brinking1 { display: block; margin: 0 auto; } .test .brinking2,.test .brinking3 { animation-delay:5s; -webkit-animation-delay:5s; position: absolute; top: 0; left: 25%; } @keyframes test { 0% { opacity: 0; } 50% { opacity: 1; } } @-webkit-keyframes test { 0% { opacity: 0; } 50% { opacity: 1; } } </style>
- 締切済み
- CSS
- 訪問済みリンク色を設定したいが難易度高いです
以下のHTMLのハイパーリンクになってる文字列に対し、「訪問済みリンク色（a:visited）」だけ新たに設定したいです。 現在はすべて文字色は赤で、訪問済みリンクであっても色は赤のままです。それを訪問済みリンクなら青になるようにしたいです。 ブラウザの設定で変更する方法ではなく、CSSで変更したいです。 <body>タグの中は「一切いじれない状態」なので、<body>の外部に新たにcssを書き、そこから色を変更したいですが、ハイパーリンクの文字列は、タグの挟まれ方の種類が以下のとおり(5)種類あります・・・ <a>タグは、<a href="http://*" class="title">と<a href="http://*"> の(2)種類、 他にも<span>や<strong>の位置が違ってたりしますが、<body>の中はいじらずに訪問済みリンク色だけ変更することは可能でしょうか？ <body> <div class="blogbody"> <div class="text"> ■文字列(1) <li><span style="color: red"><a href="http://*"><strong><span style="color: red">文字列(1)</span></strong></a><strong>★</strong></span><span style="color: black">DATE</span></li> ■文字列(2) <li><a href="http://*" class="title"><strong><span style="color: red">文字列(2)</span></strong></a>DATE</li> ■文字列(3) <li><a href="http://*" class="title"><span style="color: red"><strong>文字列(3)</strong></span></a><span style="color: red"><strong>★</strong></span><span style="color: black">DATE</span></li> ■文字列(4) <li><a href="http://*"><span style="color: red"><strong>文字列(4)</strong></span></a><span style="color: red"><strong>★</strong></span><span style="color: black">DATE</span></li> ■文字列(5) <li><a href="http://*"><strong><span style="color: red">文字列(5)</span></strong></a>DATE</li> </div> </div> </body>
- ベストアンサー
- HTML
- DreamWeaverMXでスタイルシートを使わない方法
DreamWeaverMXを使用しています。 文字に色をつけたり大きさを変えたりするときに、自動的にスタイルシートでタグが入力されてしまいます。 例えば赤文字にしたときに <font color="red">赤い文字</font> こうしたいのに <head> <style type="text/css"> <!-- .style1 {color: #FF0000} --> </style> </head> <body> <span class="style1">赤い文字</span> </body> こういうタグが入ってしまいます。 これをHTMLだけのタグがはいるようにしたいのですが、そういう設定方法はないでしょうか？ ご存知の方がいましたらよろしくお願いします。
- ベストアンサー
- グラフィックソフト
- Excelで前後に紛れ込んでいる空白を一括で削除したいです。
Excel2003使用者です。 セル内の文字で、その前後に空白があるものが含まれています。 その空白をシート内で一括で削除する方法を教えて下さい。 削除したいのは前後の空白のみで、文字間の空白はそのままです。 (もし前に空白があれば、文字は左詰めされる) つたない説明でお分かりでしょうか？ よろしくお願いします。
- ベストアンサー
- オフィス系ソフト
- ネットスケープ4.78でのスタイルシート
質問します。よろしくお願いします。 win版のネットスケープ4.78でスタイルシートがおかしくなります。 <head><style type="text/css"> .text1{color:red ;} </style></head> <!-- 省略 --> <td class="text1"> <span style="color:blue ;">【What's New!】</span> <br> こんにちは！ </td> という感じにしています 上記の記述だと、【What's New!】だけが青で、以下の 「こんにちは！」は赤い文字になるはずだと思うのですが、 意図に反して「こんにちは！」も青い文字になってしまいます。 ネットスケープの4.xではスタイルシートが不安定というのは 知っていましたが、ここまでひどかったかなぁ、と思っています。 どこか記述がおかしいところがあるのでしょうか？ よろしければご指摘をいただければ幸いです。
- ベストアンサー
- HTML
- 文字列前後の「全角空白/半角空白/改行文字」を取り除く
PHPで、「文字列の前後に付加されている全角空白/半角空白/改行文字を取り除く」 という処理をしたいのですが、以下のように置換処理を書くとうまくいきません。 $after = preg_replace('/^[ \r\n]*(.*)[ \r\n]*$/u', '$1', $before); // [ \r\n]→[半角空白、全角空白、改行文字]です どううまくいかないのかといいますと、入力として半角スペース＋全角文字が入ったときに、全角文字の先頭文字が文字化けしてしまいます。 たとえば、 <半角スペース>あああ をこれにかけると、 <よくわからない文字>ああ となります。 以下のように2回に分けてみると、正常に動きます。 $tmp = preg_replace('/[ \r\n]*$/u', '', $before); $after = preg_replace('/^[ \r\n]*/u', '', $tmp); 最初のように1回の正規表現による置換で済ませたい場合、 どのように書くのが適切なのでしょうか？ PHPのバージョンは5.2.3です。
- ベストアンサー
- PHP
- 直接スタイルシートを埋め込む方法で区切り文字はどうしたらよいのでしょうか
<th style="background-color:#ffff00">テスト</th> と直接スタイルシートを埋め込む方法で、 スタイルシートの設定を２つ以上以下を追加したいのですが、 区切り文字はどうしたらよいのでしょうか？ border-bottom-color:red border-left-color:red border-right-color:red border-top-color:red border-color:red 直接埋め込むメリット、デメリット（手間がかかる以外）が知りたいです。
- ベストアンサー
- HTML
- HTMLとCSSを駆使して棒グラフを作る際にラベルを表示させたい
下記のHTMLで、ラベル（30～60の数値）を赤棒の上に表示する書き方をご教示下さい。 Excelグラフで、棒グラフに数値を表示させるようなイメージです。 なお、IE6だけで動作すれば十分です。 <html> <head> <style type="text/css"> .1 {vertical-align: bottom;} .2 {background-color: red;width: 20px; writing-mode:tb-rl;} </style> </head> <body> <table border="0"> <tr> <td class="1"><span class="2" style="height:30px;"></span><span class="3">30</span></td> <td class="1"><span class="2" style="height:40px;"></span><span class="3">40</span></td> <td class="1"><span class="2" style="height:50px;"></span><span class="3">50</span></td> <td class="1"><span class="2" style="height:60px;"></span><span class="3">60</span></td> </tr> </table> </body> </html>
- ベストアンサー
- HTML
お礼
ありがとうございました。