解決済
プラグインだけリンク下の下線を外したい。プラグインのボタンの装飾を一部だけつけたい。
質問は２つです。１．プラグインだけリンクした文字に出る下線を消したいです。
本文のリンクは下線を消したくありません。
２．ボタンとは<Form><Input type="button" value="文字" onClick="location.href='URL'"></Form>のことです。
プラグインの１箇所だけを点線でふちどりしたいんですが、
他のブログ内検索とかまで、ボタンが縁取られてしまいます。
１箇所のスペース内だけ縁取りたい場合はどうすればいいですか？お願いしますm(__)m
回答(1)
1.
質問２はわからないので
質問１だけ回答してみます。
初心者なのであてにしないでくださいね。
■CSSの適当な場所に以下の記述を追加してください。
#sidelink a:link{text-decoration:none;}
#sidelink a:visited{text-decoration:none;}
#sidelink a:active{}
#sidelink a:hover{text-decoration:none;}
■HTMLテンプレートのプラグインを表示させるタグの前後に<div id="sidelink"> ～ </div> タグを追加する。
<$PluginList_A$> <$PluginList_B$>↓↓↓
<div id="sidelink"> <$PluginList_A$> <$PluginList_B$> </div>先程自分のブログで検証してみましたが
カレンダーのリンク部分が細字になってしまう以外は特に問題はなさそうです。
とりあえずトップページだけでやってみてください。
mannendoco_life
万年床生活者さん、オニキス☆さん、お二人とも３日に渡りありがとうございましたm(__)m
リンクの下線もボタンも思うようにできました☆
コメント(19)
>>1
私、ホントに初心者だから
真に受けないほうがいいかもしれませんよ。
早く上級者の方が回答してくれると良いのですが・・・。
いずれにせよ、作業前には
CSSと各種HTMLテンプレートのバックアップをお忘れなく。
質問２は、フリーエリアであれば
ボタンの装飾はその中だけで出来るので
他への影響は無いですよね・・・？
回答ありがとうございます。しかも、わざわざ試していただいたなんて…。
カレンダーの部分が細字になるのはちょっと困るので、なんとか打開策を考えたいと思います。
ちなみにライブドアブログです。
質問２なんですが、
フリーエリアのボタンの装飾を変えてしまうと
他の、例えば、Blog内検索の検索ボタンまでもが
変わってしまって、困っています。
Blog内検索の検索ボタンは標準的なものにしたくて…
>>#3 飲み込みが早い方で良かった(^^)
>カレンダーの部分が細字になるのはちょっと困るのではは...やっぱり？
でもわたしにはむりぽorz
>Blog内検索の検索ボタンまでもが >変わってしまって、困っています。そのフリーエリア内だけクラス指定すれば良いのでは？
「ボタンの縁取り」というのは
例えばこんな感じ↓ですか？
http://blog.livedoor.jp/mannendoco_life/
※サイドバーの「ブログ内検索」と「テスト（意味ナシ）」を見比べてみてください。
（検証用ブログを作るのが面倒なので、自分のブログのトップページで一時的にこうしているだけです。見てもらったら元に戻します）
カレンダーのアンカーがついている部分だけなら、acalenderのクラスが指定されていますので、
A.acalendar:link {
text-decoration:none;
・・・他の設定したいスタイル
}
などと個別に指定してやればよいかと思います。>>#5 鬼先生
>acalenderのクラスが指定されていますので確かにその通りです。
しかし、私のブログのトップページと個別記事ページのカレンダーを見比べてみてください。
"acalender"の設定内容は個別記事ページのそれなので、トップページも同様に太字＋下線になるはずなのですが・・・。
クラス指定だって、ライブドア側で自動的にされるはずです。
『設定同士がケンカする』ということはありえるのでしょうか？
>>#4 補足
「テスト（意味ナシ）」のボタンのタグ↓
■CSS
.sample2 { border: medium yellow dotted; }
■フリーエリアのタグ<form>
<input type="button" class="sample2" value="画像を拡大する"
onClick="window.open('http://image.blog.livedoor.jp/
mannendoco_life/imgs/2/2/22040984.jpg','',
'width=264,height=352,resizable=yes');">
</form>
>>#6 補足
万年床生活者＞トップページ＞カレンダー＞６月２０日＞タグ
■CSS
a.acalendar{color:#69C;text-decoration:underline;font-weight:bold;}
■リンク「２０（６月２０日）」部分のタグ<td width="14%" align="center" class="caloncalendardbg"><span class="calendar"> <a href="http://blog.livedoor.jp/mannendoco_life/ archives/2006-06.html#20060620" class="acalendar">20</a></span></td>
>>#6
えっと、トップのHTMLにしか、<div id="sidelink">～</div>を書いてないってことはないでしょうか？
トップページのカレンダーは、idの方のセレクタ#sidelink aが採用されていて、個別ページの方はclassのacalenderが採用されているように見えます。個別記事ページ、カテゴリアーカイブ、月別アーカイブのHTMLにも同じ処理を施せばたぶん同じに見えると思いますが。。。そういう意味じゃなかったら、ごめんなさい。
方針としては間違ってないとは思いますが。。。
>>#9
当然私のブログのトップページと個別記事ページ、並びに
それぞれのソースをご覧になった上でのご発言ですよね。
>idの方のセレクタ#sidelink aが採用されていて、個別ページの方はclassのacalenderが採用されているように見えます正直、<div id～>
と<div class～>の違いすら解っていません＾＾；
なんとなく、aのような定義済みクラスはidのほうが強い（？）ような気がしたので
>>1 のような回答になりました。
初心者的にはもう限界です。
質問者さんからレスが来たら
鬼先生、ビシっと回答おながいします！
ブログって・・・ムズカスィ! (> <)
あ、忘れてました。
>>#9
>トップのHTMLにしか、<div id="sidelink">～</div>を書いてないってことはないでしょうか？その通り、トップページにしか書いてません。
でもそのトップページのカレンダー内のリンクも
class="acalendar"になってるのに・・・。
もう、ギブ！！！
お二人ともありがとうございますm(__)m
明後日あたりには言われた通りにブログを
変更してみたいと思います。
もしよければ鬼先生もコメントでなく
回答でお書きください。。(^□^)
>>#10-11
いあいあ、ご理解は正しいですよ。トップでは、<div id="sidelink">～</div>があるので、「a.acalender」より限定の強い「#sidelink a」が優先されます。a.calenderと同じスタイルでいいなら、#sidelink aを取るか、同じプロパティを設定すればよいかと思います。
idとclassの使い分けですが、idはページの中で一つしかない特定のものに使い、classは汎用性のあるスタイルに使います。万年床生活者さんのブログでは、サイドバーは一つしかないので、この部分のスタイルを特定するために、#指定をするのは自然だと思います。
>>#12
右も左も初心者さんが3カラムなら、右と左で（サイドバーですよｗ）2つ指定することになると思います。もし、トラブルがあればコメント下さい。その際、ご自身のブログのアドレスを公開して頂くと、アドバイスしやすいです。
基本的に回答１の方針でいいと思いますので、私はコメントにさせて頂きます＾＾
＃先生はご勘弁下さいｗ
もしよければ“鬼先生”もＧｏｏｏｏｏｏｏｄ！！！！！ヽ(´～｀)ノ
ところで右も左も初心者さん、
質問２の「ボタンの縁取り」については
すでにご理解いただけたかと思うのですが、いかがでしょうか？
次回コメント時にお知らせください。
>>#13
私の頭では理解度はせいぜい40%といったところでしょうか・・・。重要なポイントだということは理解できます。
＞idはページの中で一つしかない特定のものに使い、classは汎用性のあるスタイルに使います
なんとなくそういうイメージはありました。勉強になります。
＞サイドバーは一つしかないので ～ #指定をするのは自然だと思います
>>1 を回答するのに精一杯で、３カラムの存在を完全に忘れてました(> <)
ここで、質問１について整理しておきます。
■記事本文のリンク文字は下線が出る
■サイドバーの、カレンダーを除く全てのプラグイン（最新記事・最新コメント・ニュース等）の中のリンク文字は下線が出ないようにする
ここでふと思ったのですが・・・
デフォルトが「下線が出ない」設定にしておいて
記事本文だけ下線が出るようにする、という方法もありますよね。
これならacalendarの設定が確実に反映されるから
最新記事一覧には下線が出なくて
カレンダーの日付のリンクは太字で下線が出るようにできるはず。
いい機会だから検証用のブログでも作ってみようかなぁ。。。
デフォルトが「下線が出ない」設定にしておいて 記事本文だけ下線が出るようにするこれならいけそうです。
自分のブログ（２カラム）でやってみた限りでは
カレンダーの日付のリンクも細字にならずに済みました(^^)
