简单的个人介绍网页-开场特效（HTML+CSS）【附代码】
生活随笔
收集整理的這篇文章主要介紹了
简单的个人介绍网页-开场特效（HTML+CSS）【附代码】
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
動態效果
當鼠標放在字母上后會出現光暈
代碼
<!DOCTYPE html> <html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>I'm Chris!</title><style>* {margin: 0;padding: 0;}body {min-height: 100vh;display: flex;justify-content: center;align-items: center;background-color: black;}h2 {color: #222;font-size: 100px;}h2 a {text-decoration: none;color: white;}h2 span {transition: 0.5s;}h2:hover span:nth-child(1) {margin-right: 10px;}h2:hover span:nth-child(2) {margin-left: 30px;}h2 span:nth-child(1)::after {opacity: 0;transition: 2s;}h2:hover span:nth-child(1)::after {content: "'";opacity: 1;}h2:hover span {color: white;text-shadow: 0 0 10px #fff,0 0 20px #fff,0 0 40px #fff,0 0 80px #fff;}</style> </head><body><h2><span>I</span>M<span> CHRIS! </span></h2> </body></html>總結
以上是生活随笔為你收集整理的简单的个人介绍网页-开场特效（HTML+CSS）【附代码】的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 加密交易的下个十年
- 下一篇： 网页特效怎么插HTML代码中,入门：如何