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

05_css选择器的使用

一、css选择器的类型

  • 1、标签选择器

用法:直接写 写标签名:标签名{}

示例:

<!-- <!DOCTYPE html -->
<html><head><meta charset="utf-8"><title>标签选择器</title><style type="text/css">div {text-align: center;width: 600px;height: 400px;color: blue;background: blanchedalmond;}</style></head><body><!-- 标签名是:div --><div>使用标签选择器添加样式</div></body>
</html>

  • 2、id选择器

用法:元素的id属性:#id名{}

示例:

<!-- <!DOCTYPE html -->
<html><head><meta charset="utf-8"><title>id选择器</title><style type="text/css">#type {text-align: center;width: 600px;height: 400px;color: blue;background: blanchedalmond;}</style></head><body><!-- id名是:type --><div id="type">使用id选择器添加样式</div></body>
</html>

  • 3、类选择器

用法:元素的class属性  .class 值{}
(类选择器是使用最多的一种方式)

示例:

<!-- <!DOCTYPE html -->
<html><head><meta charset="utf-8"><title>class选择器</title><style type="text/css">.type {text-align: center;width: 600px;height: 400px;color: blue;background: blanchedalmond;}</style></head><body><!-- class名是:type --><div class="type">使用class选择器添加样式</div></body>
</html>

  • 4、层级选择器

用法:按照层级找到对应需要添加化样式的元素名

示例:

<!-- <!DOCTYPE html -->
<html><head><meta charset="utf-8"><title>层级选择器</title><style type="text/css">div b span {text-align: center;width: 600px;height: 400px;color: blue;background: blanchedalmond;}</style></head><body><!-- 选择span标签的内容 --><div ><b>这时候div标签下面的b标签的内容,<span>这时候div标签下面的b标签下面的span的内容</span>新的内容</b></div></body>
</html>

  • 5、组选择器

用法:多个元素名,统一使用一个样式

示例:

<!-- <!DOCTYPE html -->
<html><head><meta charset="utf-8"><title>组选择器</title><style type="text/css">h1,h2,h3 {color: blue;}</style></head><body><h1>一级标题</h1><h2>二级标题</h2><h3>三级标题</h3></body>
</html>

相关文章:

05_css选择器的使用

一、css选择器的类型 1、标签选择器 用法&#xff1a;直接写 写标签名&#xff1a;标签名{} 示例&#xff1a; <!-- <!DOCTYPE html --> <html><head><meta charset"utf-8"><title>标签选择器</title><style type"te…...

跨平台游戏引擎 Axmol-2.0.0 正式发布

下载 https://github.com/axmolengine/axmol/releases/tag/v2.0.0 更新日志 添加实验性的 WebAssembly 构建支持(WebGL 2.0)&#xff0c;由 nowasm 贡献 已知问题 WebGL context lost 尚未处理 部署在 github pages 的 demo 可快速预览&#xff0c;注意&#xff1a;由于 Git…...

面试总结归纳

面试总结 注&#xff1a;循序渐进&#xff0c;由点到面&#xff0c;从技术点的理解到项目中的使用&#xff0c; ​ 要让面试官知道&#xff0c;我所知道的要比面试官更多 一、Mybatis 为ORM半持久层框架&#xff0c;它封装了JDBC&#xff0c;开发时只需要关注sql语句就可以了…...

【刷题篇】贪心算法(一)

文章目录 分割平衡字符串买卖股票的最佳时机Ⅱ跳跃游戏钱币找零 分割平衡字符串 class Solution { public:int balancedStringSplit(string s) {int lens.size();int cnt0;int balance0;for(int i0;i<len;i){if(s[i]R){balance--;}else{balance;}if(balance0){cnt;}}return …...

从维基百科通过关键字爬取指定文本内容

通过输入搜索的关键字&#xff0c;和搜索页数范围&#xff0c;爬出指定文本内内容并存入到txt文档。代码逐行讲解。 使用re、res、BeautifulSoup包读取&#xff0c;代码已测&#xff0c;可以运行。txt文档内容不乱码。 import re import requests from bs4 import BeautifulS…...

pytorch代码实现之SAConv卷积

SAConv卷积 SAConv卷积模块是一种精度更高、速度更快的“即插即用”卷积&#xff0c;目前很多方法被提出用于降低模型冗余、加速模型推理速度&#xff0c;然而这些方法往往关注于消除不重要的滤波器或构建高效计算单元&#xff0c;反而忽略了特征内部的模式冗余。 原文地址&am…...

一文解析-通过实例讲解 Linux 内存泄漏检测方法

一、mtrace分析内存泄露 mtrace&#xff08;memory trace&#xff09;&#xff0c;是 GNU Glibc 自带的内存问题检测工具&#xff0c;它可以用来协助定位内存泄露问题。它的实现源码在glibc源码的malloc目录下&#xff0c;其基本设计原理为设计一个函数 void mtrace ()&#x…...

Spring Boot常用的参数验证技巧和使用方法

简介 Spring Boot是一个使用Java编写的开源框架&#xff0c;用于快速构建基于Spring的应用程序。在实际开发中&#xff0c;经常需要对输入参数进行验证&#xff0c;以确保数据的完整性和准确性。Spring Boot提供了多种方式来进行参数验证&#xff0c;并且可以很方便地集成到应…...

手机+卫星的科技狂想

最近硬件圈最火热的话题之一&#xff0c;应该就是突然上线、遥遥领先的华为Mate 60 Pro了。 其中&#xff0c;CPU和类5G网速是怎么实现的&#xff0c;是大家特别关注的问题。相比之下&#xff0c;卫星通话这个功能&#xff0c;讨论度就略低一些&#xff08;没有说不火的意思&am…...

便捷查询中通快递,详细物流信息轻松获取

在如今快节奏的生活中&#xff0c;快递已成为人们生活中不可或缺的一部分。然而&#xff0c;快递查询却常常让人头疼&#xff0c;因为需要分别在不同的快递公司官网上进行查询&#xff0c;耗费时间和精力。为了解决这个问题&#xff0c;固乔科技推出了一款便捷的快递查询助手&a…...

ARM接口编程—Interrupt(exynos 4412平台)

CPU与硬件的交互方式 轮询 CPU执行程序时不断地询问硬件是否需要其服务&#xff0c;若需要则给予其服务&#xff0c;若不需要一段时间后再次询问&#xff0c;周而复始中断 CPU执行程序时若硬件需要其服务&#xff0c;对应的硬件给CPU发送中断信号&#xff0c;CPU接收到中断信号…...

适用于Linux的Windows子系统(PHP搭建lmap、redis、swoole环境)

目录 前言 一、Windows安装Linux子系统 二、Ubuntu搭建PHP开发环境 1.PHP 安装 2.Apache2 安装 3.MySQL安装 4.Redis安装 5.Swoole安装 总结 前言 系列分为三章&#xff08;从安装到项目使用&#xff09;&#xff1a; 一、适用于Linux的Windows子系统&#xff08;系统安装步骤…...

Vue3+Ts+Vite项目(第十二篇)——echarts安装与使用,vue3项目echarts组件封装

概述 技术栈&#xff1a;Vue3 Ts Vite Echarts 简介&#xff1a; 图文详解&#xff0c;教你如何在Vue3项目中引入Echarts&#xff0c;封装Echarts组件&#xff0c;并实现常用Echarts图例 文章目录 概述一、先看效果1.1 静态效果1.2 动态效果 二、话不多数&#xff0c;引入 …...

hive location更新hive元数据表详解

1.hive location更新方式 一、通过修改表DDL&#xff1a; alter table table_name set location hdfs://nm:8020/table_path 二、直接修改hive 的meta info: update DBS set DB_LOCATION_URI replace(DB_LOCATION_URI,"oldpath","newpath")update SDS…...

【SpringBoot】统一功能处理

目录 &#x1f383;1 拦截器 &#x1f380;1.1 拦截器的代码实现 &#x1f3a8;1.2 拦截器的实现原理 &#x1f9f6;2 拦截器应用——登录验证 &#x1f9ba;3 异常统一处理 &#x1f3ad;4 统一数据返回格式 &#x1f9e4;4.1 为什么需要统一数据返回格式 &#x1f9e3;4.2 统…...

分布式数据库-架构真题(二十六)

构件组装成软件系统的过程分为三个不同的层次&#xff08;&#xff09;。&#xff08;2018年&#xff09; 初始化、互连和集成连接、集成和演化定制、集成和扩展集成、扩展和演化 答案&#xff1a;C &#xff08;2018年&#xff09;CORBA服务端构件模型中&#xff0c;&#x…...

MyWebServer开发日记-socket

打算把 tinyWebServer 重写成跨平台&#xff08;Windows and Linux&#xff09;的。 这里首先需要跨平台的 sokcet&#xff0c;主要参考 尹圣雨 的 TCP/IP 网络编程 来着&#xff1a; 代码写的有些笨&#xff0c;欢迎批评&#xff1a; 首先是一个 socket 类&#xff0c;主要…...

图书管理信息系统分析与设计

一、系统开发的可行性分析 &#xff08;一&#xff09;系统背景.必要性及意义 随着社会经济的迅速发展和科学技术的全面进步&#xff0c;计算机事业的飞速发展&#xff0c;以计算机与通信技术为基础的信息系统正处于蓬勃发展的时期。随着经济文化水平的显著提高&#xff0c;人…...

Charles基础使用指南

##Charles 基本使用指南 Charles 在本地构建一个HTTP代理服务器&#xff0c;可以实现对HTTP、HTTPS请求的抓取&#xff0c;也就是我们常说的抓包&#xff0c;以及对请求响应的修改等。 Charles 官网地址 https://www.charlesproxy.com/ ###一、移动端的抓包实现 1. PC端开启…...

Android12之/proc/pid/status参数含义(一百六十五)

简介&#xff1a; CSDN博客专家&#xff0c;专注Android/Linux系统&#xff0c;分享多mic语音方案、音视频、编解码等技术&#xff0c;与大家一起成长&#xff01; 优质专栏&#xff1a;Audio工程师进阶系列【原创干货持续更新中……】&#x1f680; 人生格言&#xff1a; 人生…...

UMA 2 - Unity Multipurpose Avatar☀️三.给UMA设置默认服饰Recipes

文章目录 🟥 项目基础配置🟧 给UMA配置默认服饰Recipes🟨 设置服饰Recipes属性🟥 项目基础配置 将 UMA_DCS 预制体放到场景中创建空物体,添加DynamicCharacterAvatar 脚本,选择 HumanMaleDCS作为我们的基本模型配置默认Animator 🟧 给UMA配置默认服饰Recipes 服饰Re…...

uniapp-小程序登录授权框

微信官方文档 不弹出授权框原因 因为版本问题&#xff0c;目前的最新的版本是不支持 wx.getUserInfo 去主动弹出授权框 只能引导用户去点击 butten 去授权 解决方法 我的思路是参考了其他的微信微信小程序, 就是跳转到我的页面的时候 在钩子函数内去触发一个封装的模态框,状…...

Unity 性能优化Shader分析处理函数:ShaderUtil.GetShaderGlobalKeywords用法

Unity 性能优化Shader分析处理函数&#xff1a;ShaderUtil.GetShaderGlobalKeywords用法 点击封面跳转下载页面 简介 Unity 性能优化Shader分析处理函数&#xff1a;ShaderUtil.GetShaderGlobalKeywords用法 在Unity开发中&#xff0c;性能优化是一个非常重要的方面。一个常见…...

第一百四十一回 如何添加程序启动页

文章目录 概念介绍使用方法示例代码 我们在上一章回中介绍了如何解决BLE包中的错误的内容&#xff0c;本章回中将介绍如何添加程序启动页.闲话休提&#xff0c;让我们一起Talk Flutter吧。 概念介绍 程序启动页就是点击手机桌面上的程序启动图标后显示的页面&#xff0c;也叫s…...

从零开始的PICO教程(4)--- UI界面绘制与响应事件

从零开始的PICO教程&#xff08;4&#xff09;— UI界面绘制与响应事件 文章目录 从零开始的PICO教程&#xff08;4&#xff09;--- UI界面绘制与响应事件一、前言1、大纲2、教程示例 二、具体步骤1、PICO VR环境配置2、XR的UI Canvas画布创建与调整&#xff08;1&#xff09;C…...

IntelliJ IDEA 远程调试 Tomcat

准备工作 明确远程服务器的 IP 地址&#xff0c;比如我是&#xff1a;192.168.92.128 关掉服务器防火墙&#xff1a;service iptables stop 本地 Remote Server 配置 添加 Remote Server&#xff0c;如下图 复制 Remote Server 自动生成的 JVM 参数&#xff0c;等下有用&…...

谷粒商城----认证服务

一、短信验证码&#xff08;阿里云短信服务&#xff09; Data ConfigurationProperties(prefix "spring.cloud.alicloud.sms") Component public class SmsComponent {private String host;private String path;private String skin;private String sign;private S…...

Mediasoup源码介绍

一、Mediasoup 整体结构 整个Mediasoup库通过Nodejs管理&#xff0c;比如整体逻辑、worker、router、producer、consumer...都是通过JS进行管理的。 其底层的数据传输是通过C部分进行控制的&#xff0c;通过NodeJs来控制C部分&#xff0c;以实现整体的数据传输效 二、Mediasou…...

GIS入门,WKT格式详解

WKT介绍 WKT是Well-known Text的缩写,它是一种用于描述地理空间几何对象的文本格式。 WKT是一种开放的国际标准,由Open Geospatial Consortium(OGC)定义和维护。 WKT是一种标准的表示方法,可以用来描述点、线、面等地理空间对象的形状和位置。通过使用一系列的坐标点和关…...

Qt之postEvent

基本介绍 postEvent方法所属类为QCoreApplication&#xff0c;完整声明如下&#xff1a; [static] void QCoreApplication::postEvent(QObject *receiver, QEvent *event, int priority Qt::NormalEventPriority) 该方法的作用是将要发送的事件推送到对应线程的事件队列中&…...

室内设计3d效果图用什么软件/贵州seo技术查询

摘要&#xff1a;《计算机网络:自顶向下方法(原书第4版)》是当前世界上最为流行的计算机网络教科书之一,采用了作者独创的自顶向下的方法来讲授计算机网络的原理及其协议,即从应用层协议开始沿协议栈向下讲解,强调应用层范例和应用编程接口,使读者尽快进入每天使用的应用程序环…...

门户网站开发是什么/google登录入口

基于Matlab的湘江水质重金属污染预测模型研究 安徽农业科学 。 J o arn a l o f A n h u i A g fi &#xff0e;S c i &#xff0e; 2 0 1 2。 4 0 ( 9) &#xff1a; 5 4 9 6— 5 4 9 8 责任编辑杨莹莹责任校对况玲玲 基于 Ma t l a b的湘江水质重金属污染预测模型研究 宁 可 …...

网站建设公司 南京/网络建站优化科技

安装php&#xff08;fastcgi模式&#xff09;的时候&#xff0c;常常有这样一句命令&#xff1a;/usr/local/webserver/php/bin/phpize 一、phpize是干嘛的&#xff1f; phpize是什么东西呢&#xff1f;php官方的说明&#xff1a; https://php.net/manual/en/install.pecl.phpi…...

建一网站要多少钱/百度收录时间

1.图形化界面启动 右击“计算机”&#xff0c;在快捷菜单中选择“管理”命令&#xff0c;如图所示&#xff0c;打开“计算机管理”对话框。也可以执行“开始”|“控制面板”|“管理工具”|“服务”来启动服务。 改成手动模式,每次电脑开机都需要点击启动服务 2. 命令行启动…...

卖挂的网站怎么做/手机怎么建自己的网站

Android 资源(Resources)访问有许多东西用来构建一个优秀的 Android 应用程序。除了应用程序的编码&#xff0c;你需要关注各种各样的资源&#xff0c;诸如你用到的各种静态内容&#xff0c;如位图&#xff0c;颜色&#xff0c;布局定义&#xff0c;用户界面字符串&#xff0c;…...

新闻宣传wordpress主题/如何优化关键词提升相关度

在安装之前&#xff0c;确认你的机器安装了python,和easy_install.通常python是自动安装的&#xff0c;如果没有安装easy_install&#xff0c;那么wget -q http://peak.telecommunity.com/dist/ez_setup.py获取一下python ez_setup.pypexpect是python一个模块&#xff0c;可以通…...