Hatena Blog Tags
はてなブログ トップ
ボックス装飾
このタグでブログを書く
言葉の解説
ネットで話題
関連ブログ

ボックス装飾

このタグの解説についてこの解説文は、すでに終了したサービス「はてなキーワード」内で有志のユーザーが作成・編集した内容に基づいています。その正確性や網羅性をはてなが保証するものではありません。問題のある記述を発見した場合には、お問い合わせフォームよりご連絡ください。
Little Strange Software•4年前

【CSS】コピペで使える！アニメーションするボックス（枠）サンプル集【まとめ】

どうも！LSSです！！ 以前、【CSS】ボックス装飾によく使うプロパティ おさらいとサンプル集という、それまでに作成したCSSサンプルのまとめ記事を書いていました。 気づけばそれから１年近く経ち、その間にもちょこちょこ作っていたので、その後に作ったものをまとめてみます！ …と言いつつ、見てみると結構作ってるものがバラバラで^^; 書き出すと「まとまりのないまとめ」になりそうだったので、様々なネタの中から 「アニメーションするボックス（枠）」 のまとめ記事とします^^ マウスカーソルに反応するタイプ カードをめくる その２ 光が斜めに横切るバー たたっ斬る！ マウスカーソルで枠線の太さが変わる演…

#CSS#サンプル#CSSアニメーション#ボックス装飾

関連ブログ

Little Strange Software•4年前

【CSSサンプル】２つの四角形に囲まれたボックス

こんな風に、２つの色の違う四角い枠線がズレて配置されたようなボックスを作ってみました！実はこれ、枠線じゃなくて背景だったりします。でも、枠の内容のサイズに応じて伸縮しても支障なく表示されますよ^^ どうも！LSSです！！ 実は以前からCSSサンプルのネタとして↑のような枠を思いついていたんですが、 border outline box-shadow のどれを使ってもしっくりこなくて、伸ばし伸ばしになっていました^^; …が、ふっと別の方法を思いついたのでやってみたところ、うまくいったのが今回のサンプルとなります！ コード 枠線の正体 アニメ―ションもつけてみました 他にも改変のやりようはありま…

#CSS#ボックス装飾#サンプル#もっと簡単な方法ないのかなｗ
Little Strange Software•4年前

【CSS】鹿威し（ししおどし）のように揺れる見出し【カタカタ改変】

どうも！LSSです！！ 以前に書いたCSSで、 が結構ウケが良いようで、いくつかのブログで続けて使っていただいています^^ で、今回はそれを改変したものを作ってみました！ もうすぐ年が明けるので、お正月っぽい？和風テイストの「鹿威しししおどし」風に仕上げました。 鹿威しのように揺れる見出し コード 見た目に関する部分 ボックス本体に関する指定 見出し部分に関する設定 今回、主にいじったのはkeyframesの内容 鹿威しのように揺れる見出し こんな風に、ボックス要素につけた見出しが鹿威しししおどしのように揺れる事で自己主張します！ また、ボックス要素にマウスカーソルが乗っている間は動作がちょっ…

#CSS#ボックス装飾#鹿威し