CSS层叠样式表学习(2)
(大家好,今天我们将继续来学习CSS(2)的相关知识,大家可以在评论区进行互动答疑哦~加油!💕)

目录
二、CSS基础选择器
2.1 CSS选择器的作用
2.2 选择器分类
2.3 标签选择器
2.4 类选择器
二、CSS基础选择器
2.1 CSS选择器的作用
- 选择器(选择符)就是根据不同需求把不同的标签选出来这就是选择器的作用,简单来说,就是选择标签用的。
以上CSS做了两件事:
- 找到所有的h1标签,选择器 (选对人)
- 设置这些标签的样式:比如颜色 (做对事)
2.2 选择器分类
选择器分为基础选择器和复合选择器两个大类,我们这里先讲解一下基础选择器:
- 基础选择器是由单个选择器组成的。
- 基础选择器又包括:标签选择器,类选择器id选择器和通配符选择器
2.3 标签选择器
标签选择器(元素选择器)是指用HTML标签名称作为选择器,按标签分类(名称),为页面中某一类标签指定统一的CSS样式。
语法:
标签名:{
属性1: 属性值1;
属性2: 属性值2;
属性3: 属性值3;
......
}
- 作用:标签选择器可以把某一类标签全部选择出来,比如所有的<div>标签和所有的<span>标签。
- 优点:能快速为页面中同类型的标签统一设置样式。
- 缺点:不能设计差异化样式,只能选择全部的当前标签。
2.4 类选择器
如果想要差异化选择不同的标签,单独选一个或者某几个标签,可以使用类选择器。
语法:
.类名: {
属性1: 属性值1;
......
}
结构需要用class属性来调用class类的意思。
例:<div class='red'> 变红色</div>
口诀:样式点定义 结构类(class)调用 一个或多个 开发最常用
注意:
- 类选择器使用"(英文点号)进行标识,后面紧跟着类名(自定义,我们自己命名的。
- 可以理解为给这个标签起了一个名字,来表示。
- 长名称或词组可以使用中横线来表示。
- 不要使用纯数字,中文等命名。
- 命名要有意义。
- 命名规范:见附件(web前端开发规范手册.doc)
(今日分享暂时到此为止啦!为不断努力的自己鼓鼓掌吧。今日文案分享:人生重要的,不是现在所站的位置,而是所朝的目标。)
相关文章:
CSS层叠样式表学习(2)
(大家好,今天我们将继续来学习CSS(2)的相关知识,大家可以在评论区进行互动答疑哦~加油!💕) 目录 二、CSS基础选择器 2.1 CSS选择器的作用 2.2 选择器分类 2.3 标签选择器 2.…...
【MySQL】DML的表操作详解:添加数据&修改数据&删除数据(可cv例题语句)
前言 大家好吖,欢迎来到 YY 滴MySQL系列 ,热烈欢迎! 本章主要内容面向接触过C Linux的老铁 主要内容含: 欢迎订阅 YY滴C专栏!更多干货持续更新!以下是传送门! YY的《C》专栏YY的《C11》专栏YY的…...
Docker命令及部署Java项目
文章目录 简介Docker镜像镜像列表查找镜像拉取镜像删除镜像镜像标签 Docker容器容器启动容器查看容器停止和重启后台模式和进入强制停止容器清理停止的容器容器错误日志容器别名及操作 Docker部署Java项目 简介 Docker是一种容器化技术,可以帮助开发者轻松打包应用…...
深度学习入门:从理论到实践的全面指南
深度学习入门:从理论到实践的全面指南 引言第一部分:深度学习基础第二部分:数学基础第三部分:编程和工具第四部分:构建你的第一个模型第五部分:深入学习结语 引言 大家好,这里是程序猿代码之路。…...
后端前行Vue之路(二):模版语法之插值与指令
1.概述 Vue.js的模板语法是一种将Vue实例的数据绑定到HTML文档的方法。Vue的模板语法是一种基于HTML的扩展,允许开发者将Vue实例中的数据绑定到HTML元素,以及在HTML中使用一些简单的逻辑和指令。Vue.js 基于 HTML 的模板语法允许开发者声明式地将 DOM 绑…...
Kotlin 中的类和构造方法
Kotlin 中的类与接口和 Java 中的类与接口还是有区别的。例如,Koltin 中的接口可以包含属性声明,与 Java 不同的是。Kotlin 的声明默认是 final 和 public 的。此外,嵌套的类默认并不是内部类:它们并没有包含对其它外部类的隐式引…...
【2024最新】vue3的基本使用(超详细)
一、Vue 3 概述 1. 为什么要学习Vue 3 Vue 3是Vue.js的最新主要版本,它带来了许多改进和新特性,包括但不限于: 性能提升:Vue 3提供了更快的渲染速度和更低的内存使用率。Composition API:引入了一个新的API…...
【xinference】(8):在autodl上,使用xinference部署qwen1.5大模型,速度特别快,同时还支持函数调用,测试成功!
1,关于xinference Xorbits Inference (Xinference) 是一个开源平台,用于简化各种 AI 模型的运行和集成。借助 Xinference,您可以使用任何开源 LLM、嵌入模型和多模态模型在云端或本地环境中运行推理,并创建强大的 AI 应用。 Xor…...
YARN集群 和 MapReduce 原理及应用
YARN集群模式 本文内容需要基于 Hadoop 集群搭建完成的基础上来实现 如果没有搭建,请先按上一篇: <Linux 系统 CentOS7 上搭建 Hadoop HDFS集群详细步骤> 搭建:https://mp.weixin.qq.com/s/zPYsUexHKsdFax2XeyRdnA 配置hadoop安装目录下的 etc…...
C++算法——滑动窗口
一、长度最小的子数组 1.链接 209. 长度最小的子数组 - 力扣(LeetCode) 2.描述 3.思路 本题从暴力求解的方式去切入,逐步优化成“滑动窗口”,首先,暴力枚举出各种组合的话,我们先让一个指针指向第一个&…...
Rust---有关介绍
目录 Rust---有关介绍变量的操作Rust 数值库:num某些基础数据类型序列(Range)字符类型单元类型 发散函数表达式(! 语句) Rust—有关介绍 得益于各种零开销抽象、深入到底层的优化潜力、优质的标准库和第三方库实现,Ru…...
vue项目双击from表单限制重复提交 添加全局注册自定义函数
第一步: 找到utils文件夹添加directive.js文件 import Vue from vue //全局防抖函数 // 在vue上挂载一个指量 preventReClick const preventReClick Vue.directive(preventReClick, {inserted: function (el, binding) {console.log(el.disabled)el.addEventListener(click,…...
WebPack的使用及属性配、打包资源
WebPack(静态模块打包工具)(webpack默认只识别js和json内容) WebPack的作用 把静态模块内容压缩、整合、转译等(前端工程化) 1️⃣把less/sass转成css代码 2️⃣把ES6降级成ES5 3️⃣支持多种模块文件类型,多种模块标准语法 export、export…...
机器学习实战17-高斯朴素贝叶斯(GaussianNB)模型的实际应用,结合生活中的生动例子帮助大家理解
大家好,我是微学AI,今天给大家介绍一下机器学习实战17-高斯朴素贝叶斯(GaussianNB)模型的实际应用,结合生活中的生动例子帮助大家理解。GaussianNB,即高斯朴素贝叶斯模型,是一种基于概率论的分类算法,广泛应…...
数据处理库Pandas数据结构DataFrame
Dataframe是一种二维数据结构,数据以表格形式(与Excel类似)存储,有对应的行和列,如图3-3所示。它的每列可以是不同的值类型(不像 ndarray 只能有一个 dtype)。基本上可以把 DataFrame 看成是共享…...
中国发展新能源的核心驱动力是什么?其原理是如何运作的?
中国发展新能源的核心驱动力是推进能源消费方式变革、构建多元清洁能源供应体系、实施创新驱动发展战略、深化能源体制改革和持续推进国际合作。 新能源的发展背后有多重经济、政策及环境因素的推动: 经济发展需求:随着中国经济的快速发展,…...
skywalking
部署: docker部署方式 docker-compose.yaml version: 3 services:elasticsearch:build:context: elasticsearchrestart: alwaysnetworks:- skywalking_netcontainer_name: elasticsearchimage: elasticsearch:7.17.6environment:- "discovery.typesingle-no…...
江苏开放大学2024年春《大学英语(D) 060108》第二次过程性考核作业参考答案
答案:更多答案,请关注【电大搜题】微信公众号 答案:更多答案,请关注【电大搜题】微信公众号 答案:更多答案,请关注【电大搜题】微信公众号 单选题 1从选项中选出翻译最为准确的一项。 We cannot help …...
dockerfile制作-pytoch+深度学习环境版
你好你好! 以下内容仅为当前认识,可能有不足之处,欢迎讨论! 文章目录 文档内容docker相关术语docker常用命令容器常用命令根据dockerfile创建容器dokerfile文件内容 docker问题:可能的原因和解决方法示例修改修改后的D…...
YOLOv8结合SCI低光照图像增强算法!让夜晚目标无处遁形!【含端到端推理脚本】
这里的"SCI"代表的并不是论文等级,而是论文采用的方法 — “自校准光照学习” ~ 左侧为SCI模型增强后图片的检测效果,右侧为原始v8n检测效果 这篇文章的主要内容是通过使用SCI模型和YOLOv8进行算法联调,最终实现了如上所示的效果:在增强图像可见度的同时,对图像…...
3步获取macOS完整安装包:Download Full Installer工具的终极指南
3步获取macOS完整安装包:Download Full Installer工具的终极指南 【免费下载链接】DownloadFullInstaller macOS application written in SwiftUI that downloads installer pkgs for the Install macOS Big Sur application. 项目地址: https://gitcode.com/gh_m…...
Qwen-Image-Layered场景实战:用AI图层技术为你的产品图换背景
Qwen-Image-Layered场景实战:用AI图层技术为你的产品图换背景 1. 引言 1.1 电商设计的痛点 在电商运营中,产品主图的质量直接影响转化率。传统换背景流程需要设计师手动抠图、调整边缘、匹配光影,一个产品图往往需要30分钟以上的处理时间。…...
Clawdbot+Qwen3-32B部署指南:Ollama模型注册与配置详解
ClawdbotQwen3-32B部署指南:Ollama模型注册与配置详解 1. 开始前的准备:理解Clawdbot与Qwen3-32B的关系 在动手之前,先理清楚几个关键概念。Clawdbot(现在已更名为OpenClaw)本质上是一个智能代理框架,它本…...
【latex】探索LaTeX中加粗文本的多种方法及其在表格中的优化应用
1. LaTeX加粗文本的多种方法对比 第一次用LaTeX写论文时,我也以为\textbf{}是唯一的加粗方式。直到在表格里发现加粗后的文字会把单元格撑变形,才意识到LaTeX的文本修饰比想象中复杂得多。经过反复测试,我发现实际有5种常用加粗方法…...
MusePublic Art Studio实际效果:UI设计稿生成中组件一致性保障
MusePublic Art Studio实际效果:UI设计稿生成中组件一致性保障 1. 引言:当AI成为你的UI设计搭档 想象一下这个场景:你正在为一个新的移动应用设计UI界面。你已经画好了登录页的草图,上面有圆角按钮、卡片式布局和一套清爽的配色…...
问题解决:AI股票分析师启动失败?自查脚本与Ollama服务加载
问题解决:AI股票分析师启动失败?自查脚本与Ollama服务加载 1. 引言 你满怀期待地部署了那个“AI股票分析师”镜像,点击启动,然后……页面一片空白,或者提示服务不可用。这种感觉就像准备大展拳脚时,发现工…...
工业设计必看:SolidWorks曲面建模中的NURBS核心原理与7个避坑指南(2024版)
工业设计进阶:SolidWorks曲面建模中的NURBS核心原理与高阶实践(2024版) 在汽车外壳的流线型曲面或消费电子产品的有机形态背后,NURBS(非均匀有理B样条)技术始终是工业设计软件的核心引擎。作为SolidWorks等…...
LingBot-Depth实操手册:Gradio API返回JSON结构解析与字段含义
LingBot-Depth实操手册:Gradio API返回JSON结构解析与字段含义 1. 引言:为什么需要了解API返回结构 当你使用LingBot-Depth处理深度图像时,最让人困惑的可能就是API返回的那一串JSON数据。这些数据到底代表什么?每个字段有什么含…...
MGeo中文地址结构化教程:从原始文本到标准GeoJSON格式输出的完整转换流程
MGeo中文地址结构化教程:从原始文本到标准GeoJSON格式输出的完整转换流程 1. 引言:为什么我们需要地址结构化? 你有没有遇到过这样的场景?用户填写的收货地址五花八门:“北京市海淀区中关村大街27号”、“北京海淀中…...
从《巴伦周刊》谈起,我们该如何保住 SRE 的直觉?
大多数 AI 依然停留在执行层面,它们只能在 Demo 里写写脚本。一旦丢进真实的生产集群,面对复杂的资源依赖和权限限制,它们很难像人类专家那样,给出真正能拍板的建议。最近,《巴伦周刊》对 Chaterm 的报道引起了我的注意…...
