CSS选择器 前端开发入门笔记(十)

CSS选择器

CSS选择器是用来选择需要改变样式的HTML元素的模式。到CSS3为止,支持的选择器类型有6种,包括标签选择器、派生选择器(上下文选择器)、id选择器、class选择器、属性选择器和通配符*选择器。以下是这六种选择器的简要介绍:

  1. 标签选择器:通过HTML元素的标签名来选择元素。
  2. 派生选择器(上下文选择器):通过元素的上下文关系来选择元素。
  3. id选择器:通过元素的id属性来选择元素,id属性是唯一的,且没有值列表。
  4. class选择器:通过元素的class属性来选择元素,不具有唯一性,且有词列表。
  5. 属性选择器:通过元素的属性及属性值来选择元素。
  6. 通配符选择器:通过“”符号来选择所有元素。

以下是一些元素选择器的例子:

  1. 标签选择器:
p {color: red;
}

上述样式表示,所有<p>标签的元素都将被设置为红色。

  1. 类选择器:
.intro {font-size: 20px;
}

上述样式表示,所有class属性为intro的元素都将被设置为字体大小为20px。

  1. ID选择器:
#firstname {border: 1px solid black;
}

上述样式表示,id为firstname的元素将被设置一个黑色的边框。

  1. 后代选择器:
div p {color: blue;
}

上述样式表示,所有包含在<div>标签内的<p>标签的元素都将被设置为蓝色。

  1. 子元素选择器:
div > p {color: green;
}

上述样式表示,所有直接作为<div>标签子元素的<p>标签的元素都将被设置为绿色。

  1. 相邻兄弟选择器:
div + p {color: purple;
}

上述样式表示,所有紧接在<div>标签后面的<p>标签的元素都将被设置为紫色。

  1. 通用兄弟选择器:
div ~ p {color: orange;
}

标签选择器

标签选择器是CSS布局中非常基础和重要的选择器,它可以让我们轻松地选择并样式化HTML元素。以下是一些常用的HTML标签元素,它们都可以被用作标签选择器:

  1. <div>:块级元素,常用来作为布局的容器。
  2. <p>:段落元素,用于文本内容。
  3. <h1><h6>:标题元素,用于显示不同级别的标题。
  4. <span>:内联元素,常用来为文本的一部分设置样式。
  5. <a>:链接元素,用于创建超链接。
  6. <img>:图像元素,用于插入图片。
  7. <ul><ol><li>:列表元素,用于创建不同类型的列表。
  8. <form>:表单元素,用于收集用户输入。
  9. <article><aside><footer><header><nav>等:这些是HTML5中新增的语义化标签元素,可以根据需要选择使用。

除了上述提到的标签元素,HTML中还有许多其他的标签元素,如<section><article><footer>等,都可以根据实际需要进行选择和使用。

关系选择器

关系选择器是一种CSS选择器,它可以根据元素与其他元素的关系来选择元素。常见的符号有空格、>、~,还有+等,这些都是非常常用的选择器。

  1. 子元素选择器:通过指定的父元素找到指定的子元素。语法是父元素>子元素{},例如,div>p表示选择所有div元素的直接子元素p。
  2. 空格连接:后代选择器,选择所有合乎规则的后代元素。例如,div p表示选择所有包含在div元素内的p元素。
  3. 相邻后代选择器:仅仅选择合乎规则的儿子元素,孙子、重孙元素忽略,因此又称“子选择器”。例如,div > p表示选择所有div元素的直接子元素p。
  4. +连接:相邻兄弟选择器,选择当前元素后面的所有合乎规则的兄弟元素。例如,div + p表示选择所有紧接在div元素后面的p元素。
  5. ~连接:通用兄弟选择器,选择当前元素相邻的那个合乎规则的兄弟元素。例如,div ~ p表示选择所有在div元素之后的所有p元素。

关系选择器有多种类型,包括子选择器 (E>F)、相邻兄弟选择器 (E+F)、通用兄弟选择器 (E~F)。

子选择器 (E>F)只对子元素有影响,对下一层无影响;相邻兄弟选择器 (E+F)紧贴在E元素的F元素为第一个兄弟元素;通用兄弟选择器 (E~F)选择某个元素下的某一类元素,作用于多个,被称为兄弟。

属性选择器

属性选择器是一种CSS选择器,它可以根据元素的属性来选择元素。根据属性值的不同,可以分为以下三种类型:

  1. 属性选择器:选择具有特定属性的元素。例如,[type="text"]会选择所有type属性为"text"的元素。
  2. 属性=值选择器:选择具有特定属性值的元素。例如,input[type="submit"]会选择所有type属性值为"submit"的input元素。
  3. 属性~=值选择器:选择属性值是空格分隔的值列表,其中正好有一个值为"value"的元素。例如,input[type~="button"]会选择所有type属性值中包含"button"的input元素。

除了根据属性选择元素,属性选择器还可以根据属性值的不同形式进行更精确的选择。具体来说:

  1. E[attr]:查找所有包含attr属性的E元素。
  2. E[attr=value]:查找所有attr属性值为value的E元素。
  3. E[attr~=value]:查找所有attr属性值中包含空格分隔的多个值,其中一个值为value的E元素。
  4. E[attr|=value]:查找所有attr属性值为value或以value-开头的E元素。
  5. E[attr^=value]:查找所有attr属性值以value开头的E元素。
  6. E[attr$=value]:查找所有attr属性值以value结尾的E元素。
  7. E[attr*=value]:查找所有attr属性值中任意位置包含value的E元素。

这些选择器可以根据需要灵活组合使用,以实现更精确的样式控制。同时,还可以与其他选择器结合使用,例如子元素选择器、相邻兄弟选择器、通用兄弟选择器等,以实现更复杂的选择需求。

假设我们有一个HTML文档,其中包含多个<a>标签,我们希望根据不同的属性值来选择这些标签,以应用不同的样式。具体来说,我们希望选择以下几种情况:

  1. 所有指向HTTPS协议的链接,我们将它们设置为红色。
  2. 所有指向W3Schools网站的链接,我们将它们设置为蓝色。
<a href="https://www.example.com">https链接</a>
<a href="http://www.w3school.com.cn">非https链接</a>
<a href="https://www.w3schools.com">W3Schools链接</a>

为了实现上述选择,我们可以使用属性选择器和属性=值选择器。代码如下:

/* 所有指向HTTPS协议的链接 */
a[href^="https"] {color: red;
}/* 所有指向W3Schools网站的链接 */
a[href*="w3schools"] {color: blue;
}

在上述代码中,a[href^="https"]选择器选择了所有href属性值以"https"开头的<a>标签,而a[href*="w3schools"]选择器选择了所有href属性值中包含"w3schools"的<a>标签。这样,我们就可以根据不同的属性值来选择元素,并应用不同的样式了。

属性选择器和属性=值选择器都是CSS中的选择器,它们可以根据元素的属性来选择元素。但是,它们之间存在一些区别。

属性选择器是一种最简单的属性选择器,它可以选择具有特定属性的元素。例如,[title]会选择所有title属性的元素。

属性=值选择器则更具体,它根据特定属性值进行选择。例如,input[type="submit"]会选择所有类型为"submit"的input元素。这种选择器可以更精确地控制样式的应用范围。

因此,属性选择器和属性=值选择器的区别在于它们的选择方式不同。属性选择器选择具有特定属性的元素,而属性=值选择器则根据特定属性值进行选择,可以更精确地控制样式的应用范围。

伪类选择器

伪类选择器是一种特殊的选择器,它用于选择元素的特殊状态。伪类选择器以冒号(:)开头,后跟伪类的名称。例如,:hover是一种伪类选择器,它选择鼠标悬停在上面的元素。

伪类选择器可以用于选择处于特定状态的元素,例如鼠标悬停、获得焦点、未访问等。以下是一些常见的伪类选择器:

  • :hover:选择鼠标悬停在上面的元素。
  • :focus:选择获得焦点的元素。
  • :active:选择被用户激活的元素,例如通过鼠标点击或键盘操作。
  • :visited:选择用户已经访问过的链接。
  • :link:选择尚未被访问过的链接。
  • :first-child:选择元素的第一个子元素。
  • :last-child:选择元素的最后一个子元素。
  • :nth-child(n):选择元素的第n个子元素。

伪类选择器可以单独使用,也可以与其他选择器结合使用,以选择符合特定条件的元素。通过使用伪类选择器,我们可以更精确地控制样式的应用范围,并提高网页的可访问性和交互性。

伪类选择器有一些显著的特点:

  1. 它们可以选择特定状态的元素。例如,:hover选择器可以选择鼠标悬停在上面的元素,:active选择器可以选择被用户激活的元素。
  2. 伪类选择器的功能和一般的DOM中的元素样式相似,但并不改变任何DOM内容。它们只是插入了一些修饰类的元素,这些元素对于用户来说是可见的,但是对于DOM来说是不可见的。
  3. 伪类选择器的效果可以通过添加一个实际的类来达到。
  4. 伪类选择器还可以用于选择同种元素的子节点,这是与一般的选择器不同的地方。例如,:nth-child(n)选择器可以选择元素的第n个子元素。
  5. 伪类选择器还可以用于选择处于特定状态的表单元素,以提高人机交互性能。例如,:focus选择器可以选择获得焦点的表单元素。
  6. 伪类选择器还可以用于选择打印相关的元素。例如,:fullscreen选择器可以选择处于全屏显示模式的元素。

当然,以下是一个使用伪类选择器的CSS代码示例:

/* 未访问的链接 */
a:link {color: blue;
}/* 访问过的链接 */
a:visited {color: purple;
}/* 鼠标悬停在链接上 */
a:hover {color: red;
}/* 被选中的链接 */
a:active {color: yellow;
}

在这个示例中,我们使用了四个伪类选择器来改变链接在不同状态下的颜色。这些状态包括:未访问的链接(:link)、已访问的链接(:visited)、鼠标悬停在链接上(:hover)和被选中的链接(:active)。

伪类选择器的使用场景非常广泛,以下是一些常见的使用场景:

  1. 链接和按钮点击过程中的样式设置:例如,可以使用:hover伪类选择器来改变鼠标悬停在链接或按钮上时的样式。
  2. 聚焦状态的元素:例如,可以使用:focus伪类选择器来改变用户聚焦在输入框或其他可聚焦元素时的样式。
  3. 列表元素:可以使用:nth-child(n)伪类选择器来选择列表中的特定元素,例如奇数项或偶数项。
  4. 导航菜单:可以使用:first-child:last-child伪类选择器来改变导航菜单中的第一个和最后一个元素的样式。
  5. 交互元素:例如,可以使用:active伪类选择器来改变用户点击按钮时的样式。
  6. 打印相关的元素:例如,可以使用:fullscreen伪类选择器来改变全屏显示模式下的元素样式。

伪类选择器可以用于选择处于特定状态的元素,并应用特定的样式,从而提高网页的可访问性和交互性。

伪对象选择器

伪对象选择器是一种特殊的CSS选择器,它可以选择元素的特定部分,例如前面或后面,或者第一个字符或第一行。以下是一些常见的伪对象选择器:

  1. ::before:在元素内容的最前面插入内容。
  2. ::after:在元素内容的最后面插入内容。
  3. ::first-letter:定义元素内第一个字符的样式。
  4. ::first-line:定义元素内第一行的样式。
  5. ::selection:定义选中元素之后的样式。

例如,你可以使用以下CSS代码在元素内容的最后面添加一些文本:

p::after {content: " (end of paragraph)";
}

这将在每个段落后面添加文本“(end of paragraph)”。
如何使用伪对象选择器来改变文本的首行缩进?

伪对象选择器是一种特殊类型的CSS选择器,它允许你选择和样式化文档中的特定元素的部分。这些选择器可以让你在元素的内容之前、之后、第一个字符或第一行应用样式。伪对象选择器以双冒号(::)开头,后跟选择器的名称。

以下是一些常用的伪对象选择器:

  1. ::before:这个伪对象选择器允许你在元素的内容之前插入内容。你可以使用content属性来定义要插入的内容。例如,以下CSS代码将在每个段落之前插入一个带有样式的引用:
p::before {content: "引用:";font-weight: bold;
}
  1. ::after:这个伪对象选择器允许你在元素的内容之后插入内容。与::before类似,你可以使用content属性来定义要插入的内容。例如,以下CSS代码将在每个段落的后面插入一个带有样式的链接:
p::after {content: "(更多信息)";font-weight: bold;color: blue;
}
  1. ::first-letter:这个伪对象选择器允许你选择和样式化元素内的第一个字符。例如,以下CSS代码将选择每个段落的首字母并将其设置为大写:
p::first-letter {text-transform: uppercase;
}
  1. ::first-line:这个伪对象选择器允许你选择和样式化元素内第一行的文本。例如,以下CSS代码将改变每个段落第一行的字体颜色:
p::first-line {color: red;
}
  1. ::selection:这个伪对象选择器允许你定义元素被选中时的样式。例如,以下CSS代码将改变被选中的文本的颜色和背景色:
::selection {background-color: #ffb7b7;color: #333;
}

如何使用伪对象选择器来改变文本的首行缩进?

要使用伪对象选择器来改变文本的首行缩进,你可以使用::first-line伪对象选择器,并应用text-indent属性来指定首行文本的缩进大小。

以下是一个示例,展示如何使用::first-linetext-indent属性来改变文本的首行缩进:

p::first-line {text-indent: 2em;
}

在上面的示例中,p::first-line选择器将应用于每个段落的首行文本。text-indent属性设置为2em,表示首行文本将缩进相当于两个字母"M"的宽度(em是一个相对单位,表示当前字体的字号)。你可以根据需要调整text-indent属性的值来控制首行缩进的大小。

请注意,::first-line伪对象选择器在一些浏览器中可能不受支持或有限制。因此,在使用时请确保考虑兼容性和可访问性。

使用伪对象选择器时需要注意以下几点:

  1. 确保选择器的正确使用:伪对象选择器通常以双冒号(::)开头,例如::before::after::first-letter等。要确保选择器名称的正确拼写和语法。
  2. 注意伪对象的权重:伪对象选择器具有较低的权重值,因此它们可能会被其他更具体的选择器覆盖。在使用伪对象选择器时,确保它们不会与页面中的其他样式冲突。
  3. 兼容性问题:不同的浏览器对于伪对象选择器的支持程度可能不同。在使用时,请确保考虑到主流浏览器的兼容性,并采取相应的兼容性处理措施,例如使用CSS预处理器或添加浏览器前缀。
  4. 避免过度使用:过度使用伪对象选择器可能会使页面结构变得复杂,并可能影响页面的性能。因此,在使用时应适度,并确保它们不会对页面的可读性和可访问性产生负面影响。
  5. 测试和验证:在使用伪对象选择器时,确保在各种设备和浏览器上进行测试,以确保样式在目标平台上正常显示。同时,也可以使用验证工具来检查CSS代码的语法和兼容性。

使用伪对象选择器可以提供更灵活和强大的样式选项,但需要注意正确使用、兼容性、适度使用和测试验证等方面,以确保实现所需的样式效果并保持良好的页面结构。

为什么需要css选择器

需要CSS选择器的原因如下:

  1. 将HTML页面的内容与样式分离:CSS选择器可以将HTML元素的样式统一收集起来并写在一个地方或一个CSS文件中,从而将内容与格式分离,使网页的表现统一且容易修改。
  2. 提高web开发的工作效率:使用CSS选择器可以灵活地选择HTML元素并为其添加样式,使得网页的设计更加灵活和多样化,同时也可以减少网页的代码量,增加网页浏览速度,节省网络带宽。

CSS选择器是用来选择HTML元素并为其添加样式的一种机制。选择器可以用来选择一个或多个元素,从而对它们应用相应的样式,这使得网页的设计更加灵活和多样化。使用CSS选择器可以让网页的样式更加统一、美观,还可以增加网页的可读性和可维护性。

CSS选择器是用来选择HTML元素并为其添加样式的一种机制。它是一种模式,用于匹配页面上的元素,并为这些元素应用样式。

CSS选择器有多种类型,包括元素选择器、类选择器、ID选择器、属性选择器、伪类选择器和复合选择器等。这些选择器可以通过不同的方式来选择HTML元素,以便对其进行样式化。

在CSS中,选择器通常以逗号分隔的形式放在一个规则的左侧,而右侧则指定应用于所选元素的样式。例如,以下是一个简单的CSS规则,其中使用元素选择器来选择所有的段落元素并设置其字体颜色为红色:

p {color: red;
}

在这个例子中,p是一个元素选择器,它选择了页面上所有的段落元素,并将字体颜色设置为红色。

除了元素选择器外,还有其他类型的选择器,例如类选择器和ID选择器。类选择器以.开头,后面跟着类名,而ID选择器以#开头,后面跟着ID名称。例如:

/* 类选择器 */
.my-class {background-color: yellow;
}/* ID选择器 */
#my-id {font-size: 24px;
}

类选择器和ID选择器可以用来选择具有特定类或ID的元素,并为其应用样式。

此外,CSS还支持伪类选择器和复合选择器。伪类选择器用于选择处于特定状态的元素,例如鼠标悬停在元素上时或选中复选框时。复合选择器则可以通过空格、逗号、大于号等符号将多个简单选择器组合在一起,以选择符合多个条件的元素。例如:

/* 复合选择器 */
div p {color: blue;
}/* 伪类选择器 */
a:hover {color: green;
}

通过使用不同类型的CSS选择器,我们可以灵活地选择HTML元素并为其应用样式,从而创建出美观、可维护的网页设计。

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

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

相关文章

DS5上ARM编译器样例工程改为GCC编译

想问一下&#xff0c;DS5上ARM编译器通过的样例工程&#xff0c;换成aarch64-none-elf-gcc工具链&#xff0c;是不是需要把startup.S改成gcc支持的格式呀&#xff1f;怎么改呢&#xff0c;求助大神们指点一下&#xff01;谢谢&#xff01;

leetcode40.组合总和II(去重思路精讲,经典题也可以有困难的思考!)

首先感谢您&#xff0c;打开本文章&#xff0c;一道网上很多题解的一道经典回溯题&#xff0c;能讲出什么花来呢&#xff1f; 看了这篇文章&#xff0c;希望能使您眼前一新。 大概的思路对于一些读者可能很简单&#xff0c;我也简单提一嘴解题思路&#xff0c;因为可能有新读…

C# 22H2之后的windows版本使用SetDynamicTimeZoneInformation设置时区失败处理

使用SetDynamicTimeZoneInformation设置时区返回false&#xff0c;设置失败。 使用PowerShell设置Set-TimeZone成功。 /// <summary> /// 设置本地时区 /// 参数取值"China Standard Time"&#xff0c;即可设置为中国时区 /// </summary> /// <param …

Redis从入门到精通(二)- 入门篇

文章目录 0. 前言1. 入门篇[【入门篇】1.1 redis 基础数据类型详解和示例](https://icepip.blog.csdn.net/article/details/134438573)[【入门篇】1.2 Redis 客户端之 Jedis 详解和示例](https://icepip.blog.csdn.net/article/details/134440061)[【入门篇】1.3 redis客户端之…

(六)什么是Vite——热更新时vite、webpack做了什么

vite分享ppt&#xff0c;感兴趣的可以下载&#xff1a; ​​​​​​​Vite分享、原理介绍ppt 什么是vite系列目录&#xff1a; &#xff08;一&#xff09;什么是Vite——vite介绍与使用-CSDN博客 &#xff08;二&#xff09;什么是Vite——Vite 和 Webpack 区别&#xff0…

LR学习笔记——基本面板

文章目录 面板介绍色彩调整区域明暗调整区域纹理及质感色彩饱和 面板介绍 面板如上图所示 基本可分为几个板块&#xff1a;色彩、明暗、纹理及质感、色彩饱和 色彩调整区域 色温&#xff1a;由蓝色和黄色控制色调&#xff1a;由绿色和洋红控制 互补色&#xff1a;蓝色对黄色&…

模电 01

一.半导体基本知识 1.优点&#xff1a;体积小、重量轻、使用寿命长、输入功率小、功率转换效率高。 2.性能介于导体与绝缘体 3.常用半导体材料&#xff1a;硅&#xff08;SI&#xff09; 镉&#xff08;Ge&#xff09;,化合物半导体&#xff1a;砷化镓&#xff08;GaAs&…

RabbitMQ 基础操作

概念 从计算机术语层面来说&#xff0c;RabbitMQ 模型更像是一种交换机模型。 Queue 队列 Queue&#xff1a;队列&#xff0c;是RabbitMQ 的内部对象&#xff0c;用于存储消息。 RabbitMQ 中消息只能存储在队列中&#xff0c;这一点和Kafka相反。Kafka将消息存储在topic&am…

C语言进制转换(1112:进制转换(函数专题))

题目描述 输入一个十进制整数n&#xff0c;输出对应的二进制整数。常用的转换方法为“除2取余&#xff0c;倒序排列”。将一个十进制数除以2&#xff0c;得到余数和商&#xff0c;将得到的商再除以2&#xff0c;依次类推&#xff0c;直到商等于0为止&#xff0c;倒取除得的余数…

链路聚合-静态和动态区别

链路聚合之动静态聚合方式 链路聚合组是由一组相同速率、以全双工方式工作的网口组成。 1、动态聚合&#xff1a; 动态聚合对接的双方通过交互LACP(链路聚合控制协议)协议报文&#xff0c;来协商聚合对接。 优点&#xff1a;对接双方相互交互端口状态信息&#xff0c;使端口…

基于Vue+SpringBoot的考研专业课程管理系统

项目编号&#xff1a; S 035 &#xff0c;文末获取源码。 \color{red}{项目编号&#xff1a;S035&#xff0c;文末获取源码。} 项目编号&#xff1a;S035&#xff0c;文末获取源码。 目录 一、摘要1.1 项目介绍1.2 项目录屏 二、功能模块2.1 数据中心模块2.2 考研高校模块2.3 高…

写论文的步骤有没有?正确的顺序是什么?

一、引言 在进行学术写作之前&#xff0c;我们需要明确写论文的基本步骤流程。学术写作是一项复杂而重要的任务&#xff0c;对于提升自身学术能力和研究水平具有重要意义。本文旨在详细介绍如何正确进行学术写作&#xff0c;以帮助读者更好地完成论文撰写工作。通过按照正确的…

AIGC: 关于ChatGPT的提问方式和Prompt工程

向 ChatGPT 提问的秘诀 我们打开ChatGPT的界面&#xff0c;准备输入我们问题的时候&#xff0c;我们可能会想&#xff0c;应如何和ChatGPT进行交流 我们可能会疑问是否用英文会比中文提问要好呢&#xff1f;我应该提哪些问题&#xff1f;我又如何去进行提问&#xff1f;当我们…

断点检测学习

突然看到了一种反调试的手段&#xff0c;检测api函数的首字节是否为0xcc&#xff0c;即int 3类型的断点&#xff0c;来反调试&#xff0c;尝试一下 #include<stdio.h> #include<stdlib.h> void fun(int a) {a;a--;a 5;a - 5;return; } int main() {void (*ptr)(i…

项目讲解:让你在IT行业面试中以开发、实施、产品更近一步

1、会议系统项目 项目介绍 提示&#xff1a;可以简单介绍IT技术发展的背景 面试准备 开发 实施 产品 2、医疗项目 项目介绍 提示&#xff1a;可以谈谈你认为IT行业就业方向有哪些&#xff0c;并说出你认为最好的就业领域是什么&#xff1f; 面试准备 开发 实施 产品 3、数字化交…

【STM32】W25Q64 SPI(串行外设接口)

一、SPI通信 0.IIC与SPI的优缺点 https://blog.csdn.net/weixin_44575952/article/details/124182011 1.SPI介绍 同步&#xff08;有时钟线&#xff09;&#xff0c;高速&#xff0c;全双工&#xff08;数据发送和数据接收各占一条线&#xff09; 1&#xff09;SCK:时钟线--&…

Spring Boot要如何学习?【云驻共创】

Spring Boot 是由 Pivotal 团队提供的全新框架&#xff0c;其设计目的是用来简化新 Spring 应用的初始搭建以及开发过程。该框架使用了特定的方式来进行配置&#xff0c;从而使开发人员不再需要定义样板化的配置。我这里会分享一些学习Spring Boot的方法和干货&#xff0c;包括…

计算机毕业设计选题推荐-内蒙古旅游微信小程序/安卓APP-项目实战

✨作者主页&#xff1a;IT研究室✨ 个人简介&#xff1a;曾从事计算机专业培训教学&#xff0c;擅长Java、Python、微信小程序、Golang、安卓Android等项目实战。接项目定制开发、代码讲解、答辩教学、文档编写、降重等。 ☑文末获取源码☑ 精彩专栏推荐⬇⬇⬇ Java项目 Python…

Spring Cloud Alibaba Sentinel 简单使用

Sentinel Sentinel 主要功能Sentinel 作用常见的流量控制算法计数器算法漏桶算法 令牌桶算法Sentinel 流量控制Sentinel 熔断Sentinel 基本使用添加依赖定义资源定义限流规则定义熔断规则如何判断熔断还是限流自定义 Sentinel 异常局部自定义异常全局自定义异常系统自定义异常…

基于Apache部署虚拟主机网站

文章目录 Apache释义Apache配置关闭防火墙和selinux 更改默认页内容更改默认页存放位置个人用户主页功能基于口令登录网站虚拟主机功能基于ip地址相同ip不同域名相同ip不同端口 学习本章完成目标 1.httpd服务程序的基本部署。 2.个人用户主页功能和口令加密认证方式的实现。 3.…