BTemplates.com

2014年12月14日日曜日

bloggerでリンクに下線をつける方法css編/カスタマイズ

スポンサーリンク



bloggerはリンクに下線がつかないのが気になっていました。

本文作成中にで下線をつけても、良いのですが色は変わりますが、下線が増えたり減ったりする設定はできません。


なのでcssでクラス指定して下線付きに変更する方法色々試したら成功しましたのでそのcssを掲載します。
他のBlogでこの方法を取り入れています。このブログではしていません。



/*タイトル灰色下線なし*/
h3 a{
text-decoration: none
!important;
color: #5b5b5b
!important;
}

/*本文のリンク下線あり青色*/
.main a{
text-decoration: underline;
color: #3366CC;
}

/*本文のリンクポインタで下線なし青色*/
.main a:hover{
text-decoration:none;
color: #3366CC;
}


/*ラベルの下線なし*/
.post-labels a{
text-decoration:none;
}



/*モバイルのタイトル下線なし*/
.mobile-post-outer a{
text-decoration:none;
}


これをテンプレート→カスタマイズ→上級者向け→ccs
にコピペすれば大丈夫です。

サイドの人気記事やブログアーカイブなどには下線がなく、本文のみに下線がつく仕様です。マウスを置くと下線が外れます。

ラベルと、モバイルのタイトルも下線はつきません。

ホームと投稿(Atom)には下線がついています。
外したいのですが、なぜか外れません。classは「home-link」と「feed-link」だと思うのですが出来ません。



※自分流にカスタマイズしたBlogで使ったので他で出来るかは分かりません。

※独学なので自信ありません

※!importantを使うと崩れやすいらしいですが、これ意外に方法がわからないので使いました。





どうでもいい話ですが、cssとcssをいつも間違えてしまうのでちゃんとcssという名前だと覚えたいです。




cssを検索する
posted with カエレバ



スポンサーリンク

SHARE 

0 件のコメント:

コメントを投稿