リンクのアンダーライン

| コメント(0) | トラックバック(0)

CSSでリンクの文字と下線の間隔(スペース)が少なくて、気になった。
小粋空間で発見したソースを少しアレンジして、試してみた。

text-decoration: none;
border-bottom: 1px solid;
padding-bottom: 1px;

これをベースにして、

デザイン → テンプレート → スタイルシート
@import url(/mt/mt-static/themes-base/blog.css);
@import url(/mt/mt-static/support/themes/cityscape-houston/cityscape-houston.css);

から

blog.css

.asset-body a:link {
text-decoration: none;
border-bottom: 1px solid;
padding-bottom: 0.1mm;
}

.asset-body a:hover {
text-decoration: none;
border-bottom: none;
}


.widget-content a:hover {
text-decoration: none;
border-bottom: 1px solid;
}

cityscape-houston.css

#header a {
text-decoration: none;
}

#header a:hover {
text-decoration: none;
border-bottom: 1px solid;
padding-bottom: 0.1mm;
}

とした。
ウィジェットで少し変な所が有るが、ほとんどOK

.widget-content a:hover {
text-decoration: underline;
}

arrow03_02.gif この方が良いみたい

カスタマイズする個所が、複雑に成るので、オリジナルは必ずバックアップしておく。

トラックバック(0)

トラックバックURL: https://midforce.net/mt/mt-tb.cgi/644

コメントする

ALLER's Website

Secondary Site

BBS

月別 アーカイブ

OpenID対応しています OpenIDについて
Powered by Movable Type 6.3.2

Hatena

アイテム

  • IMG_0015 (2).JPG
  • mi7beta.PNG
  • DSC00615.JPG
  • キャプチャ.PNG
  • float.PNG
  • g+b.PNG
  • mt.PNG
  • atok2.PNG
  • atok1.PNG
  • me2.PNG