コラム 自分でホームページを作ろう

アメブロのリンク文字の下線を付ける方法

先日、こんな質問をいただきました。
お探しの方も結構いるかもしれないので、回答をシェアしておきたいと思います。

質問内容

アメブロ(アメーバブログ)で、リンク部分に下線が表示されていたはずなのに、いろいろいじっていたら、下線が表示されなくなってしまった。
下線を消す方法はすぐに見つかったが、下線を表示する方法がわからない。

CSSとかHTMLとか全くわからない私にコピペで対応出来る方法を教えて!

回答

はい。コピペで簡単に出来る方法を手順にそってお伝えしていきますね。

1)アメブロ編集画面に行く

2)左のメニュー一覧から、「デザイン変更」メニューを選択する

3)「適用中のデザイン」の「CSSの編集」をクリックする
ameblo1

4)「ブログデザインのCSSの編集」画面になったら、下へスクロール
ameblo2

5)下にスクロールして「現在使用中のブログデザインCSS」まで移動します。
その中の、英語がごちゃごちゃ書かれている部分を選択して、ここの部分の一番下までスクロールして移動します。
ameblo3

6)次のCSSコード部分を選択し、コピーしてください。

コピーする部分はこの下
/*—————————–*/

/* リンク */
.skinAnchorColor,.skinBaseAnchorColor,.skinBlock a,a{
text-decoration:underline;
}

/* 訪問済のリンク */
.skinAnchorVisitedColor,.skinBaseAnchorVisitedColor,.skinBlock a:visited,a:visited{
text-decoration:underline;
}
/*—————————–*/

7)一番下までスクロールしたら、エンターキーを2回押しで改行し、一番最後にコピーした文字を貼り付けます。
ameblo4

8)忘れずに保存ボタンを押し、表示を確認してみましょう。
スクリーンショット 2014-06-27 6.32.18

9)リンク文字に下線が引かれるようになりました。
スクリーンショット 2014-06-27 5.59.35

この下線をいろいろおしゃれに変更する方法も簡単。
下線をドッドにしたり、いろんな色にしたり、工夫次第であなたのアメブロがさらに魅力的になりますよ。
スクリーンショット 2014-06-27 6.08.26

スクリーンショット 2014-06-27 6.09.57

 

 

この記事がお役に立てたら
いいね ! で最新情報を手に入れましょう

Previous Post Next Post

Related Posts

No Comments

Leave a Reply