要素（背景画像）の下に水平線アニメーションを実現するための純粋な CSS
|
効果画像:
html:
<div class='site_bar'>ホーム</div>
css:
.サイトバー{
背景画像: 線形グラデーション(赤、赤);
背景位置: 中央下;
背景サイズ: 0 2px;
background-repeat : no-repeat; //この属性は欠落できません。
遷移: .3秒;
}
.site_bar:hover{
背景サイズ: 100% 2px;
}要約する 上記は、エディターが導入した要素の下の水平線アニメーション（背景画像）の純粋な CSS 実装です。皆様のお役に立てれば幸いです。ご質問がある場合は、メッセージを残してください。エディターがすぐに返信します。また、123WORDPRESS.COM ウェブサイトをサポートしてくださっている皆様にも感謝申し上げます。 |
<<: win10 で mysql8.0.23 をインストールし、「サービスが制御機能に応答しません」という問題を解決する方法
>>: JavaScript が Jingdong の虫眼鏡効果を模倣
推薦する
Dockerのデフォルトネットワークセグメントを変更する実装方法の分析
背景同社のサーバーはすべて Alibaba Cloud ECS ホストを購入しています。デフォルトの...
Vue は Axios リクエスト フロントエンドのクロスドメイン問題をどのように解決するのか
目次序文1. クロスドメインの問題はなぜ発生するのでしょうか? 2. 解決策クロスオリジンリソース共...
CSS フロントエンドの知識ポイントのまとめ（必読）
1. CSS の概念: (カスケーディング スタイル シート)利点: 1. コンテンツとプレゼンテ...
マウスを傾けた状態でのフリップナビゲーションの問題に関する研究
この記事では、マウス フリップナビゲーションの制作についてまだ疑問を持っている友人の役に立つことを期...
MySql テーブル内の行を削除する実用的な方法
まず、どのフィールドまたはフィールドの組み合わせがデータ行を一意に識別できるかを決定する必要がありま...
純粋な CSS を使用してユーザーが Web ページのコンテンツをコピーするのを防ぐ方法
序文私自身の個人ブログを入力しているときに、ブログの詳細ページでさまざまなコンテンツをコピーするさま...
1 つの記事で MySQL のプリコンパイルを理解する
1. プリコンパイルの利点私たちは皆、プリコンパイル機能を備えた JDBC の PreparedSt...
Windows で MySQL 5.7.17 圧縮バージョンをインストールするときに遭遇する落とし穴
まず、Windows 64 ビット用の最新の MySQL 5.7.17 コミュニティ圧縮バージョンを...
Vue3.0 でページング コンポーネントを手動でカプセル化する方法
この記事では、vue3.0の手動カプセル化ページングコンポーネントの具体的なコードを参考までに紹介し...
初心者がHTMLタグを学ぶ（3）
関連記事:初心者が学ぶ HTML タグ (2)導入された HTML タグは、必ずしも XHTML 仕...
jQueryのコア機能とイベント処理の詳細な説明
目次イベントページの読み込みイベント委任イベントの切り替えイベント要約するイベントページの読み込み1...
面接官がmysqlのcharとvarcharの違いを尋ねたとき
目次charとvarcharの違いcharとvarcharの違い上記は、MySQL における cha...
Vue シングルページ アプリケーションで Markdown レンダリングを実装する
以前、Markdown をレンダリングするときに、mavonEditor のプレビュー モードを使用...
MAC+PyCharm+Flask+Vue.js ビルドシステム
目次node.js+nvm+npm を設定するnpmスイッチタオバオミラーVue.jsをインストール...
Docker 経由で wsl の tar ファイルを作成する方法
最近VScodeのリモート開発機能をいじっています。Dockerのコンテナに接続できるほか、WSLに...