ホームページ > ウェブフロントエンド > htmlチュートリアル > CSS 特殊効果を共有します -- 右側にフラッシュします

CSS 特殊効果を共有します -- 右側にフラッシュします

零下一度
リリース: 2017-06-24 14:20:14
オリジナル
2180 人が閲覧しました
rreee

1. コードを直接入力してください。レンダリングは次のとおりです。

2. この白のグラデーションのフラッシュ効果は、CSS3 を使用して作成するのが非常に簡単で便利です。唯一の欠点は、おそらく互換性の問題です。そのため、現在ではモバイル端末で一般的に使用されています。

3. さあ、さあ! (黒板をたたきながら)コードのコメントは比較的わかりやすいと思うので、要点だけ書いてください! ! !

1。

2. -webkit-text-fill-color: 透明; 設定されていない場合、白いグラデーション効果は表示されません。

3。

4. color-stop() グラデーションの位置と色を表す関数です。好きな場所にグラデーションを作成し、それを動かすと、きらめく効果が得られます。現れた!

4. 最後に、アイデアについて話しましょう:

まず、中央が白、両側がグレーのグラデーションの背景色を設定します。

次に、テキストの塗りつぶしの色を透明に設定します。 ;

次に、テキストを追加します。外側の背景色がトリミングされます (テキストのみが表示されます)。

最後に、@keyframes を使用して、白い背景の位置を左から右に循環します。

ご質問がございましたら、メッセージを残してください。 ! !

以上がCSS 特殊効果を共有します -- 右側にフラッシュしますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート