CSS 颜色设置鼠标悬停至标签效果设置

最新推荐文章于 2024-01-08 19:03:40 发布

AkagiSenpai

最新推荐文章于 2024-01-08 19:03:40 发布

阅读量2.6k

点赞数 2

分类专栏：前后端文章标签： css html html5

本文链接：https://blog.csdn.net/weixin_44176696/article/details/105519396

版权

html比较静态，能够支持的交互效果较为有限，而css则可以带来比较丰富的视觉交互的效果，以及一些友好的结构调整方案，比如颜色设置，或者是鼠标交互时的效果，这里简单的实现一下

值得注意的是css也是相对 ”静态“ 的一种 “配置语言”，没有过多的流程控制，需要的是根据选定的标签对象来配置

css选择标签对象，既可以根据其标签名（但是这个改动会影响全局的同名标签），也可以根据自定义的标签类class，或者是标签id来做不同的选择

h1 {
   
	/* 根据标签名来选择对象 */
}

.className {
   
	/* 根据标签对象自定义的class名来选择对象 */
}

# id {
   
	/* 根据标签对象自定义的id来选择对象，id唯一 */
}

使用link标签能够很好的引入css文件，说明该css里面的配置都是可以直接套用到html的，实现结构和外观的分离，其中herf属性就是css文件的地址

<link rel="stylesheet" type="text/css" href="style.css">

我们先新建一个这样的html页面
在这里插入图片描述

<!DOCTYPE html>
<html lang="zh-CN">
<meta charset="utf-8">

<head>
	<!-- title -->
	<title>css练习页面</title>
</head>
<body

关注