CSS选择器的全面解析与实战应用

CSS选择器的全面解析与实战应用

  • 一、基本选择器
    • 1.1 通配符选择器（*）
    • 2.标签选择器（div）
    • 1.3 类名选择器（.class）
    • 4. id选择器（#id）
  • 二、 属性选择器（attr）
  • 三、伪类选择器（：）
  • 四、 伪元素选择器（：：）
  • 五、 组合选择器

选择器的作用：选择页面中对应的标签，方便后续设置样式

权重：

选择器示例权重值
!importantcolor: #000 !important正无穷大
内联样式style=“…”1 0 0 0
ID选择器#id0 1 0 0
类，伪类、属性选择器.content1 0 0 0
标签选择器、伪元素选择器div0 0 0 1
继承属性inherit0 0 0 0

一、基本选择器

1.1 通配符选择器（*）

  • 通配选择器会找到页面中所有的标签，并设置样式。它可以匹配任意类型的 HTML 元素。
  • 在配合其他简单选择器的时候，省略掉通配选择器会有同样的效果。比如，*.warning 和.warning 的效果完全相同。
  • 通配符选择器在 CSS 中虽然功能强大，但由于它选择所有元素，通常不建议频繁使用，因为可能会影响性能并导致意外的样式覆盖。 开发中使用极少，只会在特殊情况下使用， 用于去除标签默认的margin和padding等。

1. 统一重置样式

  • 在项目开始时，使用通配符选择器来重置或统一所有元素的默认样式是一个常见的做法。这样可以消除浏览器的默认样式差异，确保所有元素从一个统一的基础开始。
* {margin: 0;padding: 0;box-sizing: border-box;line-height: 1;font-size: 16px;font-family: Arial, sans-serif;
}

1.2 清除浮动

  • 可以使用通配符选择器来清除所有元素的浮动效果。
*::after {content: "";display: table;clear: both;
}

2.标签选择器（div）

  • 选择指定类型的 HTML 元素。通过标签名，找到页面中所有这类标签，设置样式。 标签选择器选择的是一类标签，而不是单独某一个；标签选择器无论嵌套关系有多深，都能找到对应的标签。

1. 全局样式重置

  • 在大型项目中，通常会使用标签选择器来为全局的 HTML 元素设置初始样式或重置默认样式；确保在不同浏览器中呈现的一致性。
body, h1, h2, h3, p, ul, ol, li {margin: 0;padding: 0;box-sizing: border-box;font-family: Arial, sans-serif;
}

2. 常见元素的样式定义

  • 在页面设计中，经常需要为常见的文本元素（如段落、标题、列表等）设置统一的样式。使用标签选择器可以轻松定义这些元素的基本外观。
p {line-height: 1.6;margin-bottom: 16px;color: #333;
}h1, h2, h3 {margin-bottom: 10px;color: #222;
}

1.3 类名选择器（.class）

  • 选择具有特定类名的元素。通过类名，找到页面中所有带有这个类名的标签，并设置样式。 类名可以由数字、字母、下划线、中划线组成，但不能由数字或中划线开头。 一个标签可以同时有多个类名，类名之间以空格隔开； 类名可以重复，一个类选择器可以同时选中多个标签。

1. 组件化样式管理

  • 在现代前端开发中，尤其是使用框架（如 React、Vue 等）时，类选择器常用于为可复用的组件定义样式。每个组件都有自己的类名，这样可以确保样式的独立性，避免与其他组件的样式冲突。
<div class="card"><h2 class="card-title">Card Title</h2><p class="card-content">This is some card content.</p>
</div>

.card {border: 1px solid #ccc;padding: 20px;border-radius: 8px;
}.card-title {font-size: 18px;font-weight: bold;
}.card-content {font-size: 14px;color: #555;
}

2. 元素样式管理

  • 类选择器常用于表示元素的不同状态，特别是在交互设计中，如按钮的启用/禁用状态、表单输入的验证状态等。通过改变元素的类名，可以轻松地在不同状态之间切换样式；可以实现组件的样式复用和状态管理，增强了样式的灵活性和可维护性。
<button class="button">Submit</button>
<button class="button disabled" disabled>Disabled</button>

.button {background-color: blue;color: white;padding: 10px 20px;border: none;cursor: pointer;
}.button.disabled {background-color: grey;cursor: not-allowed;
}

4. id选择器（#id）

  • 选择具有特定 ID 的元素。为了使该元素被选中，它的 id 属性必须与选择器中给出的值完全匹配。

  • id属性值类似于身份证号码，在一个页面中是唯一的，不可重复的！（强行使用会展示效果，但是不符合语法规范！！！）

  • 一个标签上只能有一个id属性值

  • 一个id选择器只能选中一个标签

  • 类与id的区别：

    • class类名相当于姓名，可以重复，一个标签可以同时有多个class类名
    • id属性值相当于身份证号码，不可重复，一个标签只能有一个id属性值

1. 唯一元素的样式控制

  • id选择器常用于页面中仅出现一次的唯一元素，如页面的导航栏、页脚、或特定的模块。这些元素通常有特定的样式需求，使用 id选择器可以确保这些样式只应用于这个唯一元素。
<header id="main-header"><h1>Welcome to My Website</h1>
</header>

#main-header {background-color: #333;color: white;padding: 20px;text-align: center;
}

2. 结合javascript操作DOM元素

  • 在 JavaScript 中，id选择器常用于快速选择并操作特定的 DOM 元素。由于id是唯一的，可以保证选择到的是页面上唯一的那个元素。
<button id="submit-button">Submit</button>

#submit-button {background-color: #007bff;color: white;border: none;padding: 10px 20px;cursor: pointer;
}

document.getElementById('submit-button').addEventListener('click', function() {alert('Button clicked!');
});

二、 属性选择器（attr）

  • 根据元素的属性进行选择。CSS 属性选择器匹配那些具有特定属性或属性值的元素。
    在这里插入图片描述

1. 对 存在xx属性 的元素设置特定样式

  • 根据 required 属性，标记必填表单元素。
input[required] {border: 2px solid red;
}

2. 对 存在xx属性且属性值匹配 的元素设置特定样式

  • 根据 type 属性为不同类型的输入框应用不同的样式。
input[type="text"] {width: 300px;
}input[type="submit"] {background-color: blue;color: white;
}

3. 对 存在xx属性且包含属性值xx 的元素设置特定样式

  • 这个选择器会选择 href 属性中包含子字符串 “example” 的所有<a>元素。不论 “example” 位于 href 属性的开头、中间还是结尾，只要出现了这个子字符串，样式都会被应用。
a[href*="example"] {font-size: 2em;
}

4. 对 属性值以指定的值开头的 元素设置特定样式

  • 选择href属性以https字符串开头的所有<a>元素。
a[href^="https"] {color: red;font-weight: bold;
}

5. 对 属性值以指定的值结尾 的元素设置特定样式

  • 根据文件链接的后缀名，为不同类型的文件链接设置不同的样式。
a[href$=".pdf"] {color: red;font-weight: bold;
}

6. 对 属性值是以空格分隔的值之一 的元素设置特定样式

  • 这个选择器则选择 href 属性中含有以空格分隔的单词之一为 “example” 的 <a> 元素。它会将 href 属性值拆分为多个单词，并检查其中是否有 “example” 这个单词。
a[href~="example"] {padding: 2px;
}
  • a[href*="example"]：选择 href 属性中包含 “example” 的链接，不管其在字符串中的位置。
  • a[href~="example"]：选择 href 属性中包含独立单词 “example” 的链接，通常用在属性值为空格分隔的列表中。
  • 在实际应用中，*= 选择器更为常用，因为它更加灵活，可以匹配部分字符串。而 ~= 选择器则在特定情况下有用，尤其是处理以空格分隔的属性值时。

7. 状态控制

  • 使用 data-* 属性结合属性选择器实现导航栏在不同设备下的样式调整。
nav[data-visible="true"] {display: block;
}nav[data-visible="false"] {display: none;
}

三、伪类选择器（：）

1. :hover

  • 用于选择鼠标悬停在元素上时的状态。可以为按钮或链接添加悬停效果，以提高用户体验。
button:hover {background-color: #ddd;cursor: pointer;
}
  • 相关选择器：
    在这里插入图片描述

2. :active

  • 用于选择被激活的元素（通常是鼠标点击时）。当用鼠标交互时，它代表的是用户按下按键和松开按键之间的时间。可以为按钮添加点击时的反馈效果。
button:active {background-color: #bbb;
}

3. :focus

  • 用于选择获得焦点的元素。当用户点击或轻触一个元素或使用键盘的 Tab 键选择它时，它会被触发。用于突出显示当前获得输入焦点的表单元素。
input:focus {border-color: blue;outline: none;
}

4. :nth-child(n)

  • 用于选择父元素中第 n 个子元素。n 可以是具体数字，也可以是公式。交替行样式的实现，如表格或列表的奇偶行不同样式。
li:nth-child(3) {background-color: #fff;
}li:nth-child(n+3) {background-color: #111;
}li:nth-child(odd) {background-color: #222;
}li:nth-child(even) {background-color: #333;
}

5. :first-child

  • 用于选择父元素中的第一个子元素。为段落或列表中的第一个子元素设置特定样式。
p:first-child {font-weight: bold;
}

6. :last-child

  • 用于选择父元素中的最后一个子元素。去掉最后一个元素的底部边距，或为其设置不同的样式。
p:last-child {margin-bottom: 0;
}

7. :not(selector)

  • 用于选择不匹配 selector 的所有元素。由于它的作用是防止特定的元素被选中，它也被称为反选伪类（negation pseudo-class）。为一组元素应用统一样式，同时排除某些特定元素。
input:not([type="submit"]) {width: 100%;
}

8. :checked

  • 用于选择被选中的复选框或单选按钮。自定义复选框或单选按钮的选中状态样式。
input[type="checkbox"]:checked {background-color: green;
}

9. :disabled

  • 用于选择禁用状态的表单元素。为禁用的表单元素设置不同的外观，通常用于提示不可操作。
input:disabled {background-color: #e0e0e0;cursor: not-allowed;
}

10. :first-of-type

  • 用于选择父元素中第一个同类型的子元素。设置特定类型元素中的第一个元素样式。
p:first-of-type {color: red;
}

11. :last-of-type

  • 用于选择父元素中最后一个同类型的子元素。为特定类型元素中的最后一个元素设置样式。
p:last-of-type {color: blue;
}

12. :empty

  • 用于选择没有任何子元素的元素（包括文本节点）。隐藏空元素，或为其设置占位符样式。
div:empty {display: none;
}

13. :nth-of-type(n)

  • 用于选择父元素中第 n 个同类型的子元素。为特定类型的子元素按顺序应用样式，如每个列表项中的第二个元素。
/* 奇数段 */
p:nth-of-type(2n + 1) {color: red;
}p:nth-of-type(odd) {color: red;
}/* 偶数段 */
p:nth-of-type(2n) {color: blue;
}p:nth-of-type(even) {color: blue;
}/* 第一段 */
p:nth-of-type(2) {font-weight: bold;
}/* 这将匹配第三个段落，因为它匹配的元素是 2n+1 并且具有 fancy 类。第二个段落具有 fancy 类，但不匹配，因为它不是:nth-of-type(2n+1)。
*/
p.fancy:nth-of-type(2n + 1) {text-decoration: underline;
}

场景：

这些伪类选择器在日常的 CSS 开发中非常实用，能够根据元素的状态、位置等特性来精确控制样式，从而提升用户体验和界面设计的灵活性。

MDN-CSS伪类选择器

四、 伪元素选择器（：：）

1. ::before

  • ::before 创建一个伪元素，其将成为匹配选中的元素的第一个子元素。常通过 content 属性来为一个元素添加修饰性的内容。 伪元素默认是行内元素
    p::before {content: "Note: ";font-weight: bold;
}

2. ::after

  • 在 CSS 中，::after 会创建一个伪元素，作为所选元素的最后一个子元素。它通常用于为具有 content 属性的元素添加修饰内容。伪元素默认是行内元素
    p::after {content: " (end)";font-style: italic;
}

3. ::first-line

  • 选择某个块级元素的第一行。
  • ::first-line 只能在块级元素中使用，即 ::first-line 伪元素 只在display属性值为 block, inline-block, table-cell, list-item 或者 table-caption的元素上才起作用。
/* 设置多行文本框 textarea 第一行文本的样式 */
textarea::first-line {font-size: 1.3em;font-weight: 600;margin-bottom: 8px;
}

4. ::first-letter

  • 选择某个块级元素的的第一个文字，并且文字所处的行之前没有其他内容。
/* 设置 p 元素的第一个字符的样式 */
p::first-letter {color: #000;font-weight: 600;
}

5. 滚动条

  • 在块级容器上设置属性，当块级内容区域超出块级元素范围的时候，就会以滚动条的形式展示，你可以滚动里面的内容，里面的内容不会超出块级区域范围。
overflow:scroll /* x y 方向都会*/
overflow-x:scroll /*只是x方向*/
overflow-y:scroll  /*只是y方向*/

在这里插入图片描述
设置scrollbar的为CSS伪元素，对应上图的数字：

::-webkit-scrollbar              { /* 1 */ }
::-webkit-scrollbar-button       { /* 2 */ }
::-webkit-scrollbar-track        { /* 3 */ }
::-webkit-scrollbar-track-piece  { /* 4 */ }
::-webkit-scrollbar-thumb        { /* 5 */ }
::-webkit-scrollbar-corner       { /* 6 */ }
::-webkit-resizer                { /* 7 */ }::-webkit-scrollbar    				//滚动条整体部分
::-webkit-scrollbar-button   		//滚动条两端的按钮
::-webkit-scrollbar-track   		// 外层轨道
::-webkit-scrollbar-track-piece    	//内层轨道，滚动条中间部分（除去）
::-webkit-scrollbar-thumb 			//滚动条里面可以拖动的那个
::-webkit-scrollbar-corner   		//边角
::-webkit-resizer   				//定义右下角拖动块的样式

在这里插入图片描述

五、 组合选择器

1. 后代选择器（ancestor descendant）

  • 根据HTML标签的嵌套关系，选择父元素后代中满足条件的元素。 后代包括:儿子、孙子、重孙子…
    div p {color: blue;
}

2. 子选择器（parent > child）

  • 根据HTML标签的嵌套关系，选择父元素子代中满足条件的元素。 子代只包括:儿子。
    ul > li {list-style: none;
}

3. 相邻兄弟选择器（prev + next）

  • 相邻兄弟选择器可选择紧接在另一个元素后的元素，且二者具有相同的父亲元素。

    h1 + p {margin-top: 0;
}

    <p>Hello word!</p>
<p>Hello word!</p>
<h1>Hello word!</h1>
<p>Hello word!</p>
<p>Hello word!</p>
<p>Hello word!</p>
<p>Hello word!</p>

4. 通用兄弟选择器（prev ~ siblings）

  • 作用是查找某一个指定元素的后面的所有兄弟结点。

    h1 ~ p {color: grey;
}

    <p>1</p>
<h1>2</h1>
<p>3</p>
<p>4</p>
<p>5</p>

5. 并集选择器

  • 同时选择多组标签，设置相同的样式。 并集选择器中的每组选择器之间通过，分隔。并集选择器中的每组选择器可以是基础选择器或者复合选择器。并集选择器中的每组选择器通常一行写一个，提高代码的可读性。
/* p div span h1 文字颜色是红色 */
/* 选择器1, 选择器2 {} */
p, 
div, 
span, 
h1 {color: red;
}

6. 交集选择器

  • 选中页面中同时满足多个选择器的标签。既又原则)找到页面中既能被选择器1选中，又能被选择器2选中的标签，设置样式。 交集选择器中的选择器之间是紧挨着的，没有东西分隔。 交集选择器中如果有标签选择器，标签选择器必须写在最前面
/*必须是p标签,而且添加了box类 */
p.box {color: red;
}
/* .box是类选择器 */

7. 子元素选择器（>）

div > p {color: purple;
}

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

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

相关文章

欧几里得算法--(密码学基础)

欧几里得算法--(密码学基础)

根基&#xff1a;gcd(a,b)gcd(b,a mod b) 先举个例子吧&#xff0c;gcd(16,6)gcd(6,4)gcd(4,2)gcd(2,0)2 学习这个定理的时候我想了几个问题. 第一个问题&#xff1a;为什么求出的就一定是他们两个数的公约数&#xff1f; 这个问题很简单我们只需要通过几何来计较即可&#x…
阅读更多...
Electron 使⽤ electron-builder 打包应用

Electron 使⽤ electron-builder 打包应用

electron有几种打包方式&#xff0c;我使用的是electron-builder。虽然下载依赖的时候让我暴躁&#xff0c;使用起来也很繁琐&#xff0c;但是它能进行很多自定义&#xff0c;打包完成后的体积也要小一些。 安装electron-builder&#xff1a; npm install electron-builder -…
阅读更多...
python基础语法2

python基础语法2

文章目录 1.顺序语句2.条件语句2.1 语法格式 3.缩进与代码块4.空语句 pass5.循环语句5.1 while循环5.2 for循环 5.3 continue与break 1.顺序语句 默认情况下&#xff0c;python的代码都是按照从上到下的顺序依次执行的。 print(hello ) print(world)结果一定是hello world。写…
阅读更多...
【AIGC】ChatGPT提示词解析：如何打造个人IP、CSDN爆款技术文案与高效教案设计

【AIGC】ChatGPT提示词解析：如何打造个人IP、CSDN爆款技术文案与高效教案设计

博客主页&#xff1a; [小ᶻZ࿆] 本文专栏: AIGC | ChatGPT 文章目录 &#x1f4af;前言&#x1f4af;打造个人IP爆款文案提示词使用方法 &#x1f4af;CSDN爆款技术文案提示词使用方法 &#x1f4af;高效教案设计提示词使用方法 &#x1f4af;小结 &#x1f4af;前言 在这…
阅读更多...
zookeeper 服务搭建（集群）

zookeeper 服务搭建（集群）

准备3台虚拟机&#xff0c;ip分别是&#xff1a; 192.168.10.75 192.168.10.76 192.168.10.77 准备3个节点 mkdir /usr/local/cluster cd /usr/local/cluster git clone https://gitee.com/starplatinum111/apache-zookeeper-3.5.9-bin.git 重命名文件夹 mv apache-zookeeper…
阅读更多...
【学习笔记】手写一个简单的 Spring IOC

【学习笔记】手写一个简单的 Spring IOC

目录 一、什么是 Spring IOC&#xff1f; 二、IOC 的作用 1. IOC 怎么知道要创建哪些对象呢&#xff1f; 2. 创建出来的对象放在哪儿&#xff1f; 3. 创建出来的对象如果有属性&#xff0c;如何给属性赋值&#xff1f; 三、实现步骤 1. 创建自定义注解 2. 创建 IOC 容器…
阅读更多...
软件设计师——计算机网络

软件设计师——计算机网络

&#x1f4d4;个人主页&#x1f4da;&#xff1a;秋邱-CSDN博客☀️专属专栏✨&#xff1a;软考——软件设计师&#x1f3c5;往期回顾&#x1f3c6;&#xff1a;软件设计师——操作系统&#x1f31f;其他专栏&#x1f31f;&#xff1a;C语言_秋邱 一、OSI/ RM七层模型(⭐⭐⭐)…
阅读更多...
Windows安装Vim，并在PowerShell中直接使用vim

Windows安装Vim，并在PowerShell中直接使用vim

大家好啊&#xff0c;我是豆小匠。 这期介绍下怎么在windows的PowerShell上使用vim&#xff0c;方便在命令行里修改配置文件等。 先上效果图&#xff1a; 1、下载Vim GitHub传送门&#xff1a;https://github.com/vim/vim-win32-installer/releases 选择win-64的版本下载即可&…
阅读更多...
HIKVISION 海康威视对讲服务配置平台弱口令

HIKVISION 海康威视对讲服务配置平台弱口令

漏洞描述 杭州海康威视系统技术有限公司对讲服务配置平台存在弱口令 漏洞复现 FOFA "document.write(TITLE_SYSTEM);" POC admin #账号 12345 #密码 登录成功
阅读更多...
.net Framework 4.6 WebAPI 使用Hangfire

.net Framework 4.6 WebAPI 使用Hangfire

C# 使用 Hangfire 第一章 .net Framework 4.6 WebAPI 使用Hangfire 文章目录 C# 使用 Hangfire前言一、hangfire是什么？二、hangfire的特点三、.net Framework 中hangfire的使用方法第一步：创建WebAPI控制器第二步：添加nuget包第三步 创建startup类新建项目startup类Startu…
阅读更多...
算法笔记（七）——哈希表

算法笔记（七）——哈希表

文章目录 两数之和判定是否互为字符重排存在重复元素存在重复元素 II字母异位词分组 哈希表&#xff1a;一种存储数据的容器&#xff1b; 可以快速查找某个元素&#xff0c;时间复杂度O(1)&#xff1b; 当频繁查找某一个数时&#xff0c;我们可以使用哈希表 创建一个容器&#…
阅读更多...
19款奔驰E300升级新款触摸屏人机交互系统

19款奔驰E300升级新款触摸屏人机交互系统

《19 款奔驰 E300 的科技焕新之旅》 在汽车科技日新月异的时代&#xff0c;19 款奔驰 E300 的车主们为了追求更卓越的驾驶体验&#xff0c;纷纷选择对爱车进行升级改装&#xff0c;其中新款触摸屏人机交互系统的改装成为了热门之选。 19 款奔驰 E300 作为一款经典车型&#x…
阅读更多...
高炉计算笔记

高炉计算笔记

一、总体概述 热风炉是一种重要的工业热能设备&#xff0c;通过燃烧燃料将水加热为蒸汽&#xff0c;用于驱动各种设备。在热风炉的运行过程中&#xff0c;烟气量是一个重要的参数&#xff0c;表示热风炉内燃料的利用率及运行效率。烟气量的计算公式如下&#xff1a; Q α Q…
阅读更多...
iterator的使用+求数组中的第n大值+十大经典排序算法

iterator的使用+求数组中的第n大值+十大经典排序算法

目录 一、iterator的用法 二、求一个数组中的第n大值&#xff08;n为2或者3&#xff09; 1、求一个数组中的第二大值&#xff08;不能使用排序&#xff09; 2、求一个数组中的第三大值&#xff08;不能使用排序&#xff09; 三、冒泡排序 1、基本思想 2、代码实现 3、存…
阅读更多...
【Unity踩坑】Unity更新Google Play结算库

【Unity踩坑】Unity更新Google Play结算库

一、问题描述&#xff1a; 在Google Play上提交了app bundle后&#xff0c;提示如下错误。 我使用的是Unity 2022.01.20f1&#xff0c;看来用的Play结算库版本是4.0 查了一下文档&#xff0c;Google Play结算库的维护周期是两年。现在需要更新到至少6.0。 二、更新过程 1. 下…
阅读更多...
蓝桥等级考试C++组18级真题-2023-06-18

蓝桥等级考试C++组18级真题-2023-06-18

选择题 1 C L18(15分) 已定义double rate 3.921576&#xff1b;以下可以正确输出变量rate 的是()。 A printf("%d",rate)&#xff1b; B printf("%f",rate)&#xff1b; C printf("%ld",rate)&#xff1b; D printf("%r",rate)&#…
阅读更多...
初识Linux · 进程替换

初识Linux · 进程替换

目录 前言&#xff1a; 1 直接看代码和现象 2 解释原理 3 将代码改成多进程版本 4 认识所有函数并使用 前言&#xff1a; 由前面的章节学习&#xff0c;我们已经了解了进程状态&#xff0c;进程终止以及进程等待&#xff0c;今天&#xff0c;我们学习进程替换。进程替换我…
阅读更多...
（10）MATLAB莱斯（Rician）衰落信道仿真1

（10）MATLAB莱斯（Rician）衰落信道仿真1

文章目录 前言一、莱斯分布随机变量二、仿真代码与结果1.仿真代码2.仿真结果画图 后续 前言 首先给出莱斯衰落信道模型&#xff0c;引入了莱斯因子K&#xff0c;并给出莱斯分布的概率密度函数公式。然后导出莱斯分布随机变量的仿真表示式&#xff0c;建立MATLAB仿真代码&#…
阅读更多...
mysql安装及使用·1

mysql安装及使用·1

mysql安装环境变量配置pycharm连接服务初步使用 1.略 2.安装mysql之后进入到bin目录下&#xff0c; 双击输入cmd进入控制台窗口&#xff0c;输入mysql -uroot -proot&#xff08;配置的账户&#xff09;进入mysql 配置系统变量 新增bin目录到path中&#xff0c;cmd测试 3.…
阅读更多...
【python实操】python小程序之打印输入的列表内容以及列表去重的两种方法

【python实操】python小程序之打印输入的列表内容以及列表去重的两种方法

引言 python小程序之打印输入的列表内容以及列表去重的两种方法 文章目录 引言一、打印输入的列表内容1.1 题目1.2 代码1.3 代码解释 二、列表去重2.1 题目2.2 代码2.2.1 set格式转换2.2.2 for循环添加到新列表 2.3 代码解释2.3.1 set形式2.3.2 for循环 三、思考3.1 打印输入的…
阅读更多...
最新文章
推荐文章

Copyright @ 2022~2023