WordPressのテーマによっては最初から蛍光ペン風のマーカーが付いていることがあります。 その場合は設定する必要はありません。 この記事は設定されていない方向けに書いています。 蛍光ペンマーカーを設定（CSS） まずはCSSの設定からスタート。 蛍光ペンマーカーのCSSは「linear-gradient()属性」を使います。 linear-gradient(transparent 線の太さ, 線の色 0%) このlinear-gradient属性、グラデーションを使って設定します。 （）内の線の太さと線の色を好みの色と太さに変更するだけでOK。 線の太さと線の色の意味は下の通りになります。 線の太さ 黄色の蛍光ペン(太) .marker_yellow_futo { background: linear-gradient(transparent 0%, #ffff66 0%); } 黄色
CSS3で作るシンプルなマウスオーバーアニメーション5種 css3はアニメーションもできてしまうわけですが、ここではわりと簡単につくれるマウスオーバーアニメーションをご紹介いたします。 Chrome、Firefoxで動作確認しております。 投稿日2011年06月15日 更新日2011年06月15日 css3マウスオーバーアニメーションの基本 マウスオーバーアニメーションの前に通常のマウスオーバーをみてみましょう。 たとえばリンクの文字色をマウスオーバーしたときに変更したい場合はhover疑似クラスでcolorを指定しますよね。 css a { color: #3399FF; } a:hover { color: #FF6600; } これをアニメーションさせるには「transition」というプロパティを追加します。 transition: プロパティ名 時間 アニメーション方法 ; 最初
画像の上にボタンを持ってくると画像の色が変わるようなページがあります。 マウスがフォーカスしている画像が明るくなると、今どこを選んでいるのかがわかりやすくなってユーザーにとても親切です。 デザイン的にもマウスにあわせて画像が明るくなるとかっこいいですね。 そんなマウスオーバーの処理をCSS（スタイルシート）だけで簡単にやってしまう方法を紹介します。 普通、画像にマウスを合わせて明るく目立たせる場合は、 通常状態の画像とマウスを合わせたときの画像の２種類を用意して切り替えるのですが、 それが面倒くさいこともありますよね。 単純に明るくしたいだけであれば今回の方法が簡単で便利です。 CSS（スタイルシート）には透明度を指定する方法があります。 背景が白い場合は、画像を少し透過するだけで背景の白い色が浮かんで明るくなります。 ここではaタグに括られたimgタグに対して適用してみます。 a img
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
