css 选择器

1.通配选择器

  通配选择器可以对HTML中所有元素起作用,格式语法如下:

*{

属性:属性值;

}

*在这里就表示HTML里面的所有标签。

代码如下

*{
margin: 0px;

padding:0px;

}

在HTML页面中许多标签的边界填充默认值不为0,导致在网页制作过程中不好控制,通配符的出现就是为了解决这一问题,网上也有大神针对网页默认值写的代码插件,感兴趣的可以去看看。


2.标签选择器

我们都知道HTML由多个不同的标签组成,而标签选择器就是用来控制标签的应用样式。

格式语法如下:

标签名称{属性:属性值;}

如HTML里有标签

<body id="body" class="body1">
<div id="div" class="div1">我是div
<h1 id="h1" class="h11">我是h1</h1>
<p id="p" class="p1">我是p</p>
</div>
</body>

可用标签选择器来控制,单标签选择:

body{

background-color:aqua;

} //只控制body标签,定义其颜色为aqua


多标签选择:

div,h1,p{

color:brown;  //同时控制div,h1,p标签,定义字体颜色为brown。

                        //若想同时控制几个标签,可以加“,”。

}


子标签选择:

body div  p{

color:#000000;

}  //控制body下的div下的p标签。用空格隔开。


3.类选择器

在HTML里面,我们可以用class给标签定义类,如<div class="div1">,标签div的类为div1。

类的出现时方便控制标签,虽然控制标签也可以通过标签来实现,但是在面对很多重复的标签时,标签选择器会显得无用。

类选择器格式语法如下(HTML如上):

.类名{

属性:属性值;

}        //用”.”来表示类。

代码如下:

.div1{

width:100%;

height:100%;

}//设置div的高和宽,类选择器和标签一样也可以同时控制几个类及控制子类。


4.ID选择器

在HTML里面,我们可以用id给标签定义id,如<div id="div">,标签div的id是div。

id的作用和class差不多,不过id具有唯一性,比较安全可靠,所以在学习和工作中被使用得更多。

id选择器格式语法如下:

#id名{

属性:属性值;

}   //用"#"来表示id

代码如下:

#div{

font-size:20px;

}//设置div字体的大小 ,id选择器同样可以同时控制几个和父子id。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值