2024-3-13,14(CSS)

1.复合选择器

有两个或者多个基础选择器,通过不同的方式组合而成。

目的是更加准确高效的选择目标元素(标签)

分类:

后代选择器:选中某个元素的所有后代元素

写法:父选择器 子选择器 {CSS属性},父子之间用空格隔开

子代选择器:选中某个元素的子代元素(最近的儿子)

选择器写法:父代选择器 > 子代选择器 {CSS属性},父子之间用>隔开

并集选择器:选择多组标签设置相同的样式

写法:选择器1,选择器2,选择器3.......选择器n {CSS属性},,选择器之间用,隔开

伪类选择器:伪类表示元素状态,可以选中元素的某个状态设置样式

鼠标悬停状态写法:选择器:hover{CSS属性}

2.CSS特性:继承性,层叠性,优先级

继承性:子级默认继承父级的文字控制属性。

层叠性:

相同的属性会覆盖:后面的CSS属性覆盖前面的CSS属性

不同的属性会叠加:不同的CSS属性都生效。

优先级:当一个标签使用了多种选择器时,基于不同种类的选择器的匹配规则。

通配符选择器 < 标签选择器 < 类选择器 < id选择器 < 行内选择器 < !important

选中标签的范围越大,优先级越低) 

3.结构伪类选择器

根据标签的结构关系来查找标签

nth-child括号里面可以写公式,来多选

4.伪元素选择器

创建虚拟元素(伪元素),用来摆放装饰性的内容。

其实就是在一个标签内部再放置一个标签。

5.盒子模型

作用:布局网页,摆放盒子和内容。

盒子模型的构成:

内容区域:width,height

内边距:padding

边框线:border

外边距:margin(盒子外面)

6.标准流:也叫文档流,指的是标签在页面中默认的排布规则,例如块元素默认独占一行,行内元素默认一行可以显示多个。 

7.flex布局:display:flex 属性可以把父容器变为弹性容器,容器中的子标签变为弹性盒子

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/745842.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

软件授权在机器视觉行业的六大创新应用

智能制造已经离不开软件&#xff0c;软件打造高效低成本的制造是趋势&#xff0c;本文介绍通过软件授权赋能机器视觉实现更多在智能制造中的创新功能应用。 机器视觉应用软件在智能制造中呈现的六大创新应用趋势&#xff1a; 一、机器视觉&#xff1a;软件投入占比越来越高 通过…

位运算#蓝桥杯

位运算#蓝桥杯 文章目录 位运算#蓝桥杯1、小蓝学位运算2、异或森林3、位移4、笨笨的机器人5、博弈论 1、小蓝学位运算 #include<bits/stdc.h> using namespace std; using LL long long; const LL N 1e97; template<int kcz> struct ModInt { #define T (*this)…

IO流(一)

前置知识&#xff1a;字符集 常见字符集 ASCII字符集:只有英文、数字、符号等&#xff0c;占1个字节GBK字符集:汉字占2个字节&#xff0c;英文、数字占1个字节UTF-8字符集:汉字占3个字节&#xff0c;英文、数字占1个字节 Unicode字符集(统一码&#xff0c;也叫万国码) Unicode…

【Redis】Redis常用命令之Hash

1.hset&#xff1a;设置hash中指定的字段&#xff08;field&#xff09;的值&#xff08;value&#xff09;。 HSET key field value [field value ...]时间复杂度&#xff1a;插⼊⼀组field为O(1),插⼊N组field为O(N)。 返回值&#xff1a;添加的字段的个数。 2.hget&#xf…

LUA语法复习总结

文章目录 简记变量数据类型运算符算术运算符关系运算符逻辑运算符杂项运算符 列表(表)表格操作表连接插入和删除排序表 模块元表__index 元方法实例 总结__newindex 元方法实例实例 为表添加操作符实例 __call 元方法实例 __tostring 元方法实例 简记 lua下标从1开始迭代器pai…

Linux学习笔记(一)Linux基本指令

文章目录 前言目录常见命令1. pwd 打印当前所在路径2. cd 改变路径、切换路径3. 家目录 回到顶级目录4. 当前路径和上一路径5. 上一次路径6. 绝对路径和相对路径7. ls 列出目录内容8. mkdir 创建目录9. rmdir 删除目录10. touch 创建文件11. mv 修改文件目录、移动路径12. cp 复…

一口吃掉Linux基础操作

一般在windows上面想要操作Linux系统就需要装软件搞一个虚拟机&#xff0c;我用的是Ubuntu22&#xff0c;就是Linux的发行版.安装Ubuntu的过程比较复杂&#xff0c;最重要的一点是安装时要断网&#xff0c;否则会很慢。 Ubuntu 配置指南 — 地震“学”科研入门教程 先介绍一个…

光伏便携式EL检测仪是什么?—科技助农

光伏便携式EL监测仪是一种专门用于检测光伏电池组件性能的高效、实用的设备。它利用电致发光&#xff08;Electroluminescence&#xff0c;EL&#xff09;原理&#xff0c;通过检测光伏板在受到光照后产生的电流所激发出的光线&#xff0c;来评估光伏板的性能。这种设备通常具有…

C++初阶:2_类与对象(上)

类与对象(上) 一.面向过程和面向对象初步认识 C语言是面向过程的&#xff0c;关注的是过程&#xff0c;分析出求解问题的步骤&#xff0c;通过函数调用逐步解决问题。 C是基于面向对象的&#xff0c;关注的是对象&#xff0c;将一件事情拆分成不同的对象&#xff0c;靠对象之…

【DAY10 软考中级备考笔记】数据结构 图

数据结构 图 3月11日 – 天气&#xff1a;晴 晚上无线网络突然不能用了&#xff0c;花费好久弄这个&#xff0c;耽误了一些时间 1. 图的定义 这里需要注意完全图的定义&#xff0c;以及完全图的边数 这里需要注意连通图和连通分量的概念。 2. 图的存储结构 图有两种存储结构&a…

ms office学习记录:Word㈣ 布局设计引用选项卡 对应配套作业㈤

⒈页面设置 &#xff08;主要考查页面设置对话框&#xff09; 页码范围&#xff1a;对称页边距/拼页&#xff08;在一张纸上从左往右打印两页内容&#xff09; 行号可在两个位置设置 若找不到规定纸张大小&#xff0c;则文件→打印→更换驱动打印机 ⒉页面背景 页面颜色&a…

Java操作Sql语句 出现迭代死循环 (Bug排查)

目录 1. 问题所示2. 原理分析3. 解决方法4. 彩蛋1. 问题所示 Java执行Sql语句来查询一些数据的时候 虽说数据量很大,但是查询过程中一直迭代查询 截图如下所示: 2. 原理分析 至于迭代死循环,可能是不满足的条件也进入查询(本身我的数据量就很大) 主要可能引起的两个原…

python使用词袋模型将句子向量化,使用KNN进行文本分类

要使用词袋模型将句子向量化&#xff0c;并使用KNN进行分类&#xff0c;你可以使用Python的sklearn库。以下是一个简单的例子&#xff1a; 加载数据集文本预处理&#xff08;如分词、去除停用词等&#xff09;使用词袋模型进行向量化使用KNN进行训练和分类 首先&#xff0c;确…

RockChip Android13 修改U盘挂载目录

环境:Android13 安卓默认U盘挂载目录为设备UUID,如下所示: /dev/block/vold/public:8,0 on /mnt/media_rw/1E46712C467105B5 type fuseblk (rw,dirsync,nosuid,nodev,noatime,user_id=0,group_id=0,default_permissions,allow_other,blksize=4096) /dev/fuse on /mnt/user/…

自动化运维技术与工具整合

以下这些自动化运维技术与工具覆盖了软件开发和运维的多个关键领域&#xff1a;自动化配置管理、容器化、容器编排、监控与可视化、自动化构建与部署、基础设施及应用配置管理、性能监控&#xff0c;以及日志分析。Ansible 简介: Ansible 是一个开源的自动化平台&#xff0c;用…

C++/CLI学习笔记7(快速打通c++与c#相互调用的桥梁)

3.11 操作符和表达式 操作符说明=赋值操作符 a=b=0;+,-,*,/,%,+=,-=,*=,/=,%=,++,--算术操作符 int a,b,c; a=b=c-0; b=++a; c=b-a+b*a; ... >,>=,<,<=,==,!=关系操作符 a > b // a大于b就返回true a >= b // a大于或等于b就返回true a < b //a小于b就返…

C#/WPF 清理任务栏托盘图标缓存

在我们开发Windows客户端程序时&#xff0c;往往会出现程序退出后&#xff0c;任务还保留之前程序的缓存图标。每打开关闭一次程序&#xff0c;图标会一直增加&#xff0c;导致托盘存放大量缓存图标。为了解决这个问题&#xff0c;我们可以通过下面的程序清理任务栏托盘图标缓存…

【C++函数速查】lower_bound和upper_bound使用方法详细解读

文章目录 1&#xff09;概述2&#xff09;函数使用3&#xff09;案例代码 1&#xff09;概述 l o w e r _ b o u n d ( ) lower\_bound() lower_bound() 和 u p p e r _ b o u n d ( ) upper\_bound() upper_bound() 都是基于二分查找在一个排好序的数组或容器&#xff08;如 …

【UE5】非持枪趴姿移动混合空间

项目资源文末百度网盘自取 创建角色在非持枪状态趴姿移动的动画混合空间 在BlendSpace文件夹中单击右键选择 动画(Animation) 中的混合空间(Blend Space) 选择SK_Female_Skeleton 命名为BS_NormaProne 打开BS_NormaProne 水平轴表示角色的方向&#xff0c;命名为Directi…

C 练习实例76-求倒数和

题目&#xff1a;编写一个函数&#xff0c;输入n为偶数时&#xff0c;调用函数求1/21/4...1/n,当输入n为奇数时&#xff0c;调用函数1/11/3...1/n(利用指针函数)。 代码 #include <stdio.h> void fun1(int n,double *ret) {for(int i1;i<n;i2)*ret1.0/i; } void fun…