当前位置: 首页 > news >正文

css选择器

做项目遇到了一个css的问题,想记录一下,然后开通了思否
一、常用的
1、.classname
2、#id
3、*
4、标签选择器 {div} 、 {span}等 ,选择了页面全部的div、span等
二、进阶的
1、{ div, p,span}同时选择选择所有的div、p、span
2、{div p}选择所有的 div里面 (不包含div)的所有的p标签,不论是不是子一级还是子n级
3、{div>p}选择所有父级元素为div的所有的p标签,不会发生穿透的现象只会在父元素与子一级之间
4、{div+p}选择div元素后面出现的第一个p标签。出现效果的只有第一个P标签

<div>一个div</div>
<p>z这是在div后面的</p>
<p>这是在div后面的</p>

5、{div:hover 、div>p:hover}“:”之前是选择的标签,”hover“是关键字,当鼠标放上去的时候,样式会被触发,否则就是选择的标签原来的样式。hover也可以接一些选择器,让其只作用于选择的内容。(hover简单的理解为就是选择器上面的选择器中间的一个关键词,然后有鼠标进入与离开事件)
6、{关键词: focus}一般作用于input或者textarea的文本输入框中,当点击的进入的时候触发样式
7、{关键字:first-letter}作用于选择元素的第一个文字
8、{关键字:first-line}作用于选择元素的第一行内容
9、{关键字:first-child}选择的是前面选择元素的第一个所有的元素
10、{关键字:before}在选择的元素前面加上内容,使用的时候必须设置content属性。
好吧 暂时这样,继续写项目
11、
12、

相关文章:

  • Webpack4 学习笔记 - 01:webpack的安装和简单配置
  • 如何更有效的消灭watchdogs挖矿病毒?华为云DCS Redis为您支招
  • 译有关态射的一切
  • java注解的概念理解
  • 详解NodeJs流之一
  • 智能驾驶正文 0 戴姆勒与宝马抱团开发自动驾驶 新旧车企大战在即
  • 数据建模的三种分类(来自Enterprise Architect的文档)
  • Docker镜像提交命令commit的工作原理和使用方法
  • linux 计划任务
  • Ant Design 3.14.1 发布,企业级的 UI 设计语言
  • mpvue小程序开发中配置less支持
  • Android Intent传递对象为什么要序列化?
  • Vue源码解读
  • TableStore: 海量结构化数据分层存储方案
  • GitHub Draft Pull请求支持新的协作流程
  • JS中 map, filter, some, every, forEach, for in, for of 用法总结
  • 2018一半小结一波
  • cookie和session
  • Invalidate和postInvalidate的区别
  • 创建一个Struts2项目maven 方式
  • 开放才能进步!Angular和Wijmo一起走过的日子
  • 理解 C# 泛型接口中的协变与逆变(抗变)
  • 名企6年Java程序员的工作总结,写给在迷茫中的你!
  • 前端技术周刊 2019-02-11 Serverless
  • 适配mpvue平台的的微信小程序日历组件mpvue-calendar
  • 职业生涯 一个六年开发经验的女程序员的心声。
  • $Django python中使用redis, django中使用(封装了),redis开启事务(管道)
  • (保姆级教程)Mysql中索引、触发器、存储过程、存储函数的概念、作用,以及如何使用索引、存储过程,代码操作演示
  • (附源码)spring boot建达集团公司平台 毕业设计 141538
  • (六)Hibernate的二级缓存
  • (一)RocketMQ初步认识
  • (原創) 如何優化ThinkPad X61開機速度? (NB) (ThinkPad) (X61) (OS) (Windows)
  • (转)视频码率,帧率和分辨率的联系与区别
  • .NET 3.0 Framework已经被添加到WindowUpdate
  • .net Application的目录
  • .Net core 6.0 升8.0
  • .NET 发展历程
  • .NET连接数据库方式
  • .NET项目中存在多个web.config文件时的加载顺序
  • .Net语言中的StringBuilder:入门到精通
  • .NET正则基础之——正则委托
  • @SuppressWarnings注解
  • [20180224]expdp query 写法问题.txt
  • [20190113]四校联考
  • [4.9福建四校联考]
  • [AS3]URLLoader+URLRequest+JPGEncoder实现BitmapData图片数据保存
  • [CSS]文字旁边的竖线以及布局知识
  • [CTF]php is_numeric绕过
  • [DevEpxress]GridControl 显示Gif动画
  • [Flex] PopUpButton系列 —— 控制弹出菜单的透明度、可用、可选择状态
  • [HITCON 2017]SSRFme perl语言的 GET open file 造成rce
  • [HTML]HTML5实现可编辑表格
  • [NOI2020统一省选 A] 组合数问题 (推式子)
  • [RoarCTF 2019]Easy Calc
  • [代码] 类似 YYText 将表情文本转换成表情字符