HTML5点击文字变色
时间: 2024-11-18 15:16:19 浏览: 53
HTML5本身并不直接支持元素的点击事件改变颜色,但是你可以通过JavaScript或者CSS来实现这个功能。下面是一个简单的例子:
1. **纯CSS实现** (仅适用于鼠标悬停效果):
```html
<a href="#" style="color:black;">点击这里</a>
<style>
a:hover {
color: red; /* 鼠标悬停时文字变为红色 */
}
</style>
```
在这个例子中,当用户将鼠标指针放在链接上时,文字会变为红色。
2. **JavaScript实现动态变化**:
```html
<button id="myButton" onclick="changeColor()">点击我</button>
<script>
function changeColor() {
var button = document.getElementById('myButton');
if (button.style.color === 'blue') {
button.style.color = 'red'; // 点击后变红
} else {
button.style.color = 'blue'; // 再次点击恢复蓝色
}
}
</script>
```
在这里,每次点击按钮,文本的颜色会在蓝色和红色之间切换。
阅读全文