章节
问答
课签
笔记
评论
占位
占位

CSS3 last-of-type选择器

:last-of-type”选择器和“:first-of-type”选择器功能是一样的,不同的是他选择是父元素下的某个类型的最后一个子元素

示例演示

通过“:last-of-type”选择器,将容器“div.wrapper”中最后一个段落元素背景设置为橙色

提示:这个段落不是“div.wrapper”容器的最后一个子元素)。

HTML代码:

<div class="wrapper">
  <p>我是第一个段落</p>
  <p>我是第二个段落</p>
  <p>我是第三个段落</p>
  <div>我是第一个Div元素</div>
  <div>我是第二个Div元素</div>
  <div>我是第三个Div元素</div>
</div>


CSS代码:

 .wrapper > p:last-of-type{
  background: orange;
}


演示结果:

 

任务

在右边CSS编辑器中的第1行输入正确的代码,将容器“div.wrapper”中最后一个Div元素背景设置为橙色。

?不会了怎么办

是最后属性选择器的用法喔

||
1
2
<!DOCTYPE html>
<html>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
.wrapper > div
    :?{
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
提交
重置代码
||

请验证,完成请求

由于请求次数过多,请先验证,完成再次请求

加群二维码

打开微信扫码自动绑定

您还未绑定服务号

绑定后可得到

  • · 粉丝专属优惠福利
  • · 大咖直播交流干货
  • · 课程更新,问题答复提醒
  • · 账号支付安全提醒

收藏课程后,能更快找到我哦~

使用 Ctrl+D 可将课程添加到书签

邀请您关注公众号
关注后,及时获悉本课程动态

举报

0/150
提交
取消
全部 精华 我要发布

最赞回答 / 慕数据8224864
“:last-child”选择器选择的是元素的最后一个子元素。在CSS中,html中的标签元素大体被分为三种不同的类型:块状元素、内联元素(又叫行内元素)和内联块状元素。常用的块状元素有:<div>、<p>、<h1>...<h6>、<ol>、<ul>、<dl>、<table>、<address>、<blockquote> 、<form>常用的内联元素有:<a>、&...

已采纳回答 / 慕虎3236612
.wrapper>div:nth-child(3)>p:nth-child(2) 

已采纳回答 / fiona007
选择器是要满足所有条件才可以的。第一个条件: .wrapper下的子类div。第二个条件:.wrapper下的last-child。即.wrapper下的子类div中在.wrapper中又是最后一个元素的。然而这里没有任何一个div是.wrapper下的最后一个元素所以不执行

+ 我来回答 回答最高可+2积分

+ 我来回答 回答最高可+2积分

+ 我来回答 回答最高可+2积分

+ 我来回答 回答最高可+2积分
全部 我要发布
最热 最新
只看我的

本次提问将花费2个积分

你的积分不足,无法发表

为什么扣积分?

本次提问将花费2个积分

继续发表请点击 "确定"

为什么扣积分?

账号登录 验证码登录

遇到问题
忘记密码

代码语言