CSS定义

CSS:Cascading Style Sheet(层叠样式表)

选择器 {
属性名: 属性值;
}

CSS样式表

(1)三种样式表使用

  ·1> 内联样式

  <div style = 'width:100px ;height:100px'></div>

  `2> 内部样式

  <style type='text/css'>

    div{

      width:100px;

      height:100px;

    }

  </style>

  `3>外部样式

  <link rel='stylesheet' type='text/css' herf=''>

选择器

(1)6大基础选择器

  `1> id选择器:唯一对应

  `2> 类class选择器:统一对应

  `3> 标签选择器:初始化标签使用

  `4> * 通配符标签

  `5> 属性选择器:表单中input常用

  `6> 最高优先权  !important

  ******  权重值: !important > id > class > 属性 > 标签 > *

(2)复合选择器

  1> 派生选择器(父子选择器),从右到左匹配。包含两种:包含选择器和子选择器

  2> 相邻兄弟选择器:1.同父级;2.相邻;3.在其之后

  3> 兄弟选择器 ~ (匹配选择器)

  4> 并列选择器

  5> 分组选择器

伪类和伪元素

  CSS2中伪类和伪元素都是要单冒号(:)

  CSS3中伪类使用单冒号(:),伪元素使用双冒号(::)

												

css样式表,选择器,伪类选择器的更多相关文章

  1. python 全栈开发,Day47(行级块级标签,高级选择器,属性选择器,伪类选择器,伪元素选择器,css的继承性和层叠性,层叠性权重相同处理,盒模型,padding,border,margin)

    一.HTML中的行级标签和块级标签 块级标签 常见的块级标签:div,p,h1-h6,ul,li,dl,dt,dd 1.独占一行,不和其他元素待在同一行2.能设置宽高3.如果不设置宽高,默认为body ...

  2. js进阶 10-11/12 表单伪类选择器的作用

    js进阶 10-11  表单伪类选择器的作用 一.总结 一句话总结:能想到用伪类选择器来解决问题.如果能一次记住自然是最棒的. 1.表单伪类选择器分为哪两类? 表单元素和表单属性,表单元素例如inpu ...

  3. CSS3 选择器——伪类选择器

    前面花了两节内容分别在<CSS3选择器——基本选择器>和<CSS3选择器——属性选择器>介绍了CSS3选择器中的基本选择器和属性选择器使用方法,今天要和大家一起学习CSS3选择 ...

  4. CSS 选择器之基本选择器 属性选择器 伪类选择器

    CSS 选择器 常见的选择器列表图 CSS选择器笔记 基本选择器 通配符选择器(*) 元素选择器(E) 类选择器(.className)    所有浏览器都支持类选择器,但多类选择器(.classNa ...

  5. 前端 CSS的选择器 伪类选择器

    伪类选择器 常用的几种伪类选择器. 伪类选择器一般会用在超链接a标签中 没有访问的超链接a标签样式: a:link { color: blue; } <!DOCTYPE html> < ...

  6. CSS样式表-------第二章:选择器

    二 .选择器 内嵌.外部样式表的一般语法: 选择器 { 样式=值: 样式=值: 样式=值: ...... } 以下面html为例,了解区分一下各种样式的选择器 <head> <met ...

  7. 前端 CSS的选择器 伪类选择器 CSS3 nth-child()

    first-child 选中第一个标签 应用CSS样式 <!DOCTYPE html> <html lang="en"> <head> < ...

  8. HTML(五)选择器--伪类选择器

    HTML代码 <body> <a href="www.baidu.com">www.baidu.com</a> </body> CS ...

  9. CSS样式----图文详解:css样式表和选择器

    主要内容 CSS概述 CSS和HTML结合的三种方式:行内样式表.内嵌样式表.外部样式表 CSS四种基本选择器:标签选择器.类选择器.ID选择器.通用选择器 CSS三种扩展选择器:组合选择器.后代选择 ...

  10. CSS动态伪类选择器温故-3

    动态伪类选择器 伪类选择器:大家熟悉的:[:link][:visited][:hover][:active]CSS3的伪类选择器分为六种:(1)动态伪类选择器(2)目标伪类选择器(3)语言伪类选择器( ...

随机推荐

  1. Css3中自适应布局单位vh、vw

    视口单位(Viewport units) 什么是视口? 在桌面端,视口指的是在桌面端,指的是浏览器的可视区域:而在移动端,它涉及3个视口:Layout Viewport(布局视口),Visual Vi ...

  2. http和https分别是什么?

    http中文名:超文本传输协议英文名:Hyper Text Transfer Protocol解释:是一个简单的请求-响应协议,它通常运行在TCP之上.它指定了客户端可能发送给服务器什么样的消息以及得 ...

  3. Skywalking Swck Agent注入实现分析

    项目地址: GitHub - apache/skywalking-swck: Apache SkyWalking Cloud on Kubernetes 项目简介: A bridge project ...

  4. 编程架构演化史:远古时代,从打孔卡(Punched Card)开始

    回想读书时记录到书本里的打孔纸带编程,到初学编程接触到的C语言高级编程,再到C++.Java面向对象语言产生:从面向过程系统设计 到面向对象系统设计:从三层结构到MVC.MVP.MVVM:从主机到虚拟 ...

  5. MyBatis(介绍和环境配置)

    ORM(Object Relational Mapping)  设计模式,思想 对象关系映射,是一种数据持久化技术.它在对象模型和关系型数据库之间建立起对应关系,并且提供了一种机制,通过JavaBea ...

  6. Azure DevOps Pipelines部署.Net Core 应用到Kubernetes

    一.    先决条件 1.Azure Repos Git/Git和项目上传 把本地的Net Core项目上传至Azure Repos Git/Git 2.Docker Registry Service ...

  7. 【算法】基础DP

    参考资料 背包九讲 一.线性DP 如果现在在状态 i 下,它上一步可能的状态是什么. 上一步不同的状态依赖于什么. 根据上面的分析,分析出状态和转移方程.注意:dp 不一定只有两维或者一维,一开始设计 ...

  8. JavaScript基础&实战 JS中正则表达式的使用

    文章目录 1.正则表达式 1.1 代码 1.2 测试结果 2.splict | search 2.1 代码 2.2 测试结果 1.正则表达式 1.1 代码 <!DOCTYPE html> ...

  9. spring boot+vue前后端项目的分离(我的第一个前后端分离项目)

    文章目录 1.前端vue的搭建 2.后端项目的构建 pom文件中引入的jar包 yml文件用来配置连接数据库和端口的设置 application.property进行一些整合 controller层( ...

  10. C语言/python实现定时关机

    1.python def shutdown(): print('(1)定时关机\n(2)取消定时关机\n(3)立即关机\n(4)关机重启') b = eval(input('请选择:\n')) if( ...