HTML特效是前端开发中不可缺少的一部分，能够为网站增加灵动、有趣的交互效果，从而提高用户体验。下面是一些常见的HTML特效，包含代码示例：

1. 图片轮播特效：

<p ><img src="img1.jpg"><img src="img2.jpg"><img src="img3.jpg"></p><script>var slider = document.querySelector('.slider');var imgs = document.querySelectorAll('.slider img');var i = 0;setInterval(function() {i++;if(i >= imgs.length) {i = 0;}slider.style.transform = 'translateX(' + (-i * 100) + '%)';}, 3000);</script>

2. 鼠标悬停放大缩小特效：

<p ><img src="img1.jpg"><img src="img2.jpg"><img src="img3.jpg"></p><style>.img-container {display: flex;justify-content: space-between;align-items: center;}.img-container img {transition: transform .5s ease;}.img-container img:hover {transform: scale(1.2);}</style>

3. 输入框下划线特效：

<p ><input type="text"><p ></p></p><style>.input-container {position: relative;}.input-container input {border: none;outline: none;font-size: 18px;padding: 10px;}.input-container .underline {position: absolute;left: 0;bottom: 0;width: 0;height: 2px;background-color: #333;transition: width .5s ease;}.input-container input:focus + .underline {width: 100%;}</style>

4. 背景色渐变特效：

<p ></p><style>.bg {background-color: #333;transition: background-color .5s ease;}.bg:hover {background-color: #666;}</style>

5. 图片翻转特效：

<p ><p ><p ><img src="img1.jpg"></p><p ><img src="img2.jpg"></p></p></p><style>.flip-container {perspective: 1000px;}.flipper {position: relative;transform-style: preserve-3d;transition: transform .5s ease;}.front, .back {position: absolute;width: 100%;height: 100%;backface-visibility: hidden;}.back {transform: rotateY(180deg);}.flipper:hover {transform: rotateY(180deg);}</style>

这些HTML特效可以根据具体需求进行修改，定制属于自己的特效。