css选择器

最新推荐文章于 2024-07-18 17:34:14 发布

蜜桃女孩

最新推荐文章于 2024-07-18 17:34:14 发布

阅读量138

点赞数

文章标签： css

本文链接：https://blog.csdn.net/m0_46563512/article/details/107370280

版权

css基础

基础选择器

![“选择器”指明了{}中的“样式”的作用对象，也就是“样式”作用于网页中的哪些元素

1.通用元素选择器 *: 所有的标签都变色

2.标签选择器：匹配所有使用p标签的样式 p{color:red}

3.id选择器：匹配指定的标签 #p2{color:red}

4.class类选择器：谁指定class谁的变色，可选多个 .c1{color:red} 或者 div.c1{color:red}]

属性选择器

[title]
{
color:red;
}

属性选择器在为不带有 class 或 id 的表单设置样式时特别有用：

input[type="text"]
{
  width:150px;
  display:block;
  margin-bottom:10px;
  background-color:yellow;
  font-family: Verdana, Arial;
}

input[type="button"]
{
  width:120px;
  margin-left:35px;
  display:block;
  font-family: Verdana, Arial;
}

伪类选择器

a:link {color: #FF0000}		/* 未访问的链接 */
a:visited {color: #00FF00}	/* 已访问的链接 */
a:hover {color: #FF00FF}	/* 鼠标移动到链接上 */
a:active {color: #0000FF}	/* 选定的链接 */

<style>
   a{
     font-size: 14px;
     font-weight: bold;
     color: darkgray;
        }
  a:hover{
      color: red;
        }
</style>
</head>
<body>
    <a href="">首页</a>
</body>

蜜桃女孩

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
css选择器

css基础基础选择器![“选择器”指明了{}中的“样式”的作用对象，也就是“样式”作用于网页中的哪些元素1.通用元素选择器 *: 所有的标签都变色2.标签选择器：匹配所有使用p标签的样式 p{color:red}3.id选择器：匹配指定的标签 #p2{color:red}4.class类选择器：谁指定class谁的变色，可选多个 .c1{color:red} 或者 div.c1{color:red}]属性选择器[title]{color:red;}属性选择器在为不带有 clas
复制链接

扫一扫