【HTML/CSS/Javascript】ブログデザイン リンクの色を少しずつ変化させる

これは本家ブログにも書きましたが、自分の往復勉強として更新しようと思います(*‘ω‘ *)

まず最初にdiv要素とlink固有IDで自分がどの場所のリンクの色を少しずつ変化させたいかを決めて囲います。



<div id="link">
･ 
･ 
リンクを変化させたいコンテンツ 
･
･ 
</div>


次にCSS部分を書き込んであげれば完璧！！

/*トップメニューリンクの色をゆっくり変化させる*/
div#link a { 
 　　color: #ccc;    
　　text-decoration: none;    
　　-webkit-transition: 0.8s;   
　　-moz-transition: 0.8s;    
　　-o-transition: 0.8s;   
 　　-ms-transition: 0.8s;   
　　transition: 0.8s; 
}  
div#link a:hover {    
　　color: #0000cc;  
} 
/*トップメニューリンクの色をゆっくり変化させる*/

たったこれだけで反映できちゃいますので皆さんもお気軽にカスタマイズしましょ！
※バックアップは必ずとってね・・・！

けれどBloggerの場合HTMLとCSSが一緒に書かれてるのでどこがどの位置なのかしっかり見極めておく必要がありますけどねｗ

BloggerじゃCSSをskinとして扱ってますし初心者には物凄く手強いです(・_・;)
尚最初だけ理解してしまえばあとは自由自在なのでバックアップをしっかりとってから作業に移って下さいね(*‘ω‘ *)

参考ブログ

This entry was posted in