文档章节

Css 常用选择器

phpweishunlong
 phpweishunlong
发布于 2017/04/29 19:14
字数 247
阅读 10
收藏 0
后代选择器
    ul li{border:1px solid red;}

儿子选择器
    ul>li{border:1px solid red;}
		
相邻选择器:找紧跟在ul后面的指定元素
    ul+div{border:1px solid red;}
		
兄弟选择器:找ul后面所有的兄弟div

属性选择器
    li[title]{color:red;}
    常用
        li[title='yes']{color:red;}
        li[abc]{color:blue;}

以空格切开包含red的
        li[class~='red']{color:yellow;}
    以y开始的
        li[title^='y']{color:green;}
    以o结尾的
        li[title$='o']{color:green;
    包含e的
        li[title*='e']{color:green;}
        li[class|='header']{color:green;}

    找大儿子
        ul li:first-child{color:red;}
    找小儿子
        ul li:last-child{color:red;}
    找第几个儿子,下标从1开始
        ul li:nth-child(2){color:red;}
		
    获取焦点
        input:focus{border:3px solid red;}
        input:checked + span{
            margin-left:50px;
            color:red;
        }

    在元素的前面追加文本或者样式,不能识别html标签;必须配合content使用
        #p::before{
            content:'<a href="">《</a>';
            content:'';
            color:red;
            margin-right:30px;
        }
        #p::after{
            content:'》';	
        }
	
    设置文本选中的时候的样式
        #p::selection{
            background:#f66;
            color:whit
        }

© 著作权归作者所有

共有 人打赏支持
上一篇: Css 实现二级菜单
下一篇: Css 布局实例
phpweishunlong
粉丝 1
博文 64
码字总数 26288
作品 0
广州
程序员
私信 提问
css(表现层)Cascading Style Sheets层叠样式表

HTML:===> 结构层 css:===> 表现层 js:===> 行为层 css的常用三种类型选择器: 1、基本选择器: id class 标签 * 逗号选择器(,) 2、包含选择器: 子代选择器(>) 后代选择器(空格) ...

AAA年华
2017/12/09
0
0
Hybird App之选择器详解(二)

Hybird App之选择器详解(一) 学习混合app开发,要学会一些基础才能上手。本文主要介绍ID选择器、属性选择器、后代选择器、子元素选择器,其中ID选择器和属性选择器较为常用 ID选择器详解 1、...

Dwyane_Coding
2018/01/01
0
0
jQuery--(3)选择器

jQuery选择器包括 1.元素选择器 $("p"):表示选取所有的 元素 $("p.info"):表示选择所有class="info"的 元素 $("p#demo"):表示选取所有id="info"的 元素 2.属性选择器 $("[href]"):选择所......

求是科技
2016/10/11
1
0
端程序员入门所要学习的16个知识点

1、HTML常用标签 语言是什么 、Web前端开发语言、 HTML超文本标记语言 、 网页主体结构 、常用标签、超链接(a标签)、Img图片标签 2、盒子模型 初探Div盒子模型 、css样式、 简单css样式、盒...

急速奔跑中的蜗牛
2018/06/07
0
0
【前端开发系列】—— CSS3属性选择器总结

想想自己为什么要学CSS,作为一个开发过前端的人员来说,调试一个图片花了半天的时间,最后发现分隔符用错了,实在是一件很丢人的事情。因此,痛下决心来学习CSS,最近一周也会更新下相关的学...

青夜之衫
2017/12/04
0
0

没有更多内容

加载失败,请刷新页面

加载更多

Python中判断字符串是否包含中文

Python import reRE = re.compile(u'[\u4e00-\u9fa5]', re.UNICODE)match = re.search(RE, str)if match is None:# 没有包含中文字符 参考 Python regular expressions return true/f......

亚林瓜子
5分钟前
0
0
《CNCF × Alibaba 云原生技术公开课》正式首播

《CNCF × Alibaba 云原生技术公开课》立即观看:点击立即观看 云原生最初来描述云上应用的典型架构与特性,随着容器、Kubernetes、Serverless、FaaS技术的演进,CNCF(云原生计算基金会)把...

mcy0425
5分钟前
0
0
网站漏洞如何修复网站程序问题

jeecms 最近被爆出高危网站漏洞,可以导致网站被上传webshell木马文件,受影响的版本是jeecms V6.0版本到jeecmsV7.0版本。该网站系统采用的是JAVA语言开发,数据库使用的是oracle,mysql,sql数...

网站安全
9分钟前
0
0
git 中“warning: CRLF will be replaced by LF in”解决方案

https://stackoverflow.com/questions/5834014/lf-will-be-replaced-by-crlf-in-git-what-is-that-and-is-it-important...

qwfys
13分钟前
0
0
Spring Boot配置ssl证书启用HTTPS协议

一 、点睛 SSL是为网络通信提供安全及数据完整性的一种安全协议,SSL在网络传输层对网络连接进行加密。SSL协议位于TCP/IP协议和各种应用层协议之间,为数据通信提供安全支持。 SSL协议分为两...

故久呵呵
15分钟前
0
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部