WEB前端03-CSS3基础

CSS3基础

1.CSS基本概念

CSS是Cascading Style Sheets（层叠样式表）的缩写，它是一种对Web文档添加样式的简单机制，是一种表现HTML或XML等文件外观样式的计算机语言，是一种网页排版和布局设计的技术。

CSS的特点

纯CSS布局与结构式HTML相结合能帮助设计师分离外观与结构，和传统的表格布局相比，具有以下特点：

  • 网页载入更快
  • 降低流量费用
  • 修改设计时效率高
  • 更容易被搜索引擎收录

浏览器前缀

  • -ms-：IE浏览器前缀
  • -moz-： 火狐 浏览器前缀
  • -webkit-:苹果、微软和谷歌浏览器前缀
  • -o-：欧朋浏览器前缀

2.CSS的语法基础

构造CSS的样式规则

  • css由两部分构成，包括：选择符和属性
选择符 {属性1:属性值1;属性2:属性值2;属性3:属性值3;
}
  • 如果属性的值是由多个单词组成，并且单词间有空格，那么 必须给值加上引号
p{font-family:"Times New Roman"
}
  • 如果对一个选择符指定多个属性时，用分号进行分开
p{text-align:center;color:red;font-family:宋体;
}
  • 不同的选择符有相同的属性可以用逗号进行分割
p,h1{font-size:10px
}
  • 注释为
/*  */

3.CSS引入方式

三种引入方式

具体有3种引入方式，语法如下表格所示：

名称语法描述示例
行内样式在标签内使用style属性，属性值是css属性键值对<h1 style=“xxx:xxx;”>中国新闻网</h1>
内嵌样式定义<style>标签，在标签内部定义css样式<style type=“text/css”> h1 {…} </style>
外联样式定义<link>标签，通过href属性引入外部css文件<link rel=“stylesheet” href=“css/news.css”>
外导式@import url(“外部样式表相对路径”)语句将外部样式表文件链接到HTML文档中@import url(“style.css”);

对于上述3种引入方式，企业开发的使用情况如下：

  1. 内联样式会出现大量的代码冗余，不方便后期的维护，所以不常用。
  2. 内部样式，通过定义css选择器，让样式作用于当前页面的指定的标签上。
  3. 外部样式，html和css实现了完全的分离，企业开发常用方式。
外联样式与外导式的区别
--隶属关系不同:<link>标签属于HTML标签，而@import是CsS提供的载入方式。
--加载时间及顺序不同:使用<link>链接的CSS样式文件时浏览器先将外部的CSS文件加载到网页当中，然后再进行编译显示;而@import导入CSS文件时，浏览器先将HTML结构呈现出来，再把外部的CSS文件加载到网页中，当网速较慢时会先显示没有CSS时的效果，加载完毕后再渲染页面。
--兼容性不同:由于@import是css 2.1提出的，只有在IE5W上的版本才能识别，而<link>标签无此问题。DOM模型控制样式:使用JavaScript控制DOM改变样式时只能使用<link>标签，而@import不受DOM模型控制。

具体展现

  • 行内样式展现
<span style="color:red;font-weight:bold;">内联样式</span>

在HTML标签中,使用style属性来添加CSS样式，其取值由属性和值组成，两者以冒号“:”分隔，多个属性之间用分号“；”分隔。

  • 内嵌模式
 <style type="text/css">div{color=red;}</style>

常用于HTML的头部标签中

  • 链接外部样式
<link href="CSS文件的路径" type="text/css" rel="stylesheet"/>
  • href：取值为外部样式文件的路径
  • type：设置外部文档的类型。取值为text/css时，表示外部文档的类型为CSS样式表；取值为text/javascript时，表示外部文档的类型为javascript脚本
  • rel：设置当前文档与引用外部文档的关系。取值为stylesheet，表示定义一个外部样式表。

4.CSS选择器

CSS的性质
选择器名   {css样式名：css样式值;css样式名：css样式值;
}
  • CSS样式的特殊性

当基础选择器的多个规则都应用在同一元素时，权重高的样式优先。 样式优先级从高到低分别是： id选择器、类选择器、标签选择器、通用选择器。

若设置样式 样式优先级从高到低分别是 ：内联->内嵌->外联->外导

  • CSS样式的继承性

特定的CSS属性向下传递到其子元素的特性

  • CSS样式的层叠性

当同一个元素设置有多个样 式，且有相同特殊性，CSS规范将根据样式的先后顺序， 后定义的先应用。

  • CSS样式的重要性

当标签选择器的属性值后加 上”!important” 之后，该属性 设置的优先权将高于一切其 他样式规则

基础选择器
  • 通用选择器

通用选择器“ * ”号表示，它是所有选择器中作用范围最广的，能匹配页面中所有的元素。

*{margin:0px;padding:0px;border:0px}
  • 标签选择器

指用HTML标签名称作为选择器，按标签名称分类，为页面中某一类标签指定统一的CSS样式 。

标签名{font-famliy:黑体;font-size:12px;color:green;}
  • 类选择器

用来为一系列的网页元素定义相同的显示样式。类选择器使用“.”进行标识，后面紧跟类名。（在HTML中和XHTML中类名是区分大小写的）

.类名{color:green;
}
  • id选择器

用来为唯一的网页元素定义显示样式。ID选择器使用“#”进行标识，后面紧跟ID名。（在HTML中和XHTML中id名是区分大小写的）

#id名{color:green;
}
组合选择器
选择器示例示例描述
后代选择器div p选择
元素内的所有

元素。

子元素选择器div > p选择其父元素是
元素的所有

元素，即

前面的标签只可能为

此时p在div标签之内。

相邻兄弟选择器div + p选择所有紧随
元素之后第一个

元素，此时

标签在

标签之外。

p ~ ul选择前面有

元素的每个

  • 元素。

选择所有紧随
元素之后所有的

元素，此时

标签在

标签之外。

群选择器h1,h2,h3{color:green;}标签名,标签名{属性1:属性值1; 属性2:属性值2;}
属性选择器
  • 所有 CSS 属性选择器
格式：
元素[属性]{属性1=属性值;
}
选择器例子例子描述选择器作用域
[attribute][target]选择带有 target 属性的所有元素。作用于含有属性为target
[attribute=value][target=_blank]选择带有 target=“_blank” 属性的所有元素。作用于含有属性为target，且属性的值为value的元素
[attribute~=value][title~=flower]选择带有包含 “flower” 一词的 title 属性的所有元素。上面的例子会匹配以下属性的元素：title=“flower”、title=“summer flower” 以及 title=“flower new”，但不匹配：title=“my-flower” 或 title=“flowers”。
[attribute|=value][lang|=en]选择带有以 “en” 开头的 lang 属性的所有元素。值必须是完整或单独的单词
[attribute^=value]a[href^=“https”]选择其 href 属性值以 “https” 开头的每个 元素。值不必是完整单词！
[attribute$=value]a[href$=“.pdf”]选择其 href 属性值以 “.pdf” 结尾的每个 元素。值不必是完整单词！
[attribute*=value]a[href*=“w3school”]选择其 href 属性值包含子串 “w3school” 的每个 元素。值不必是完整单词！
伪类选择器

伪类是可以向某些选择器添加特殊效果的、一组CSS预定 义好的类，不需要进行id和class属性的声明，就能自动 地被支持CSS的浏览器所识别。（常常与超链接标签联用）

  • 伪类选择器标签

image-20231227160212040

5.CSS中的一些属性

1.文本属性
  • 字体样式类
-color：设置文本的颜色-font-family：设置文本的字体-font-style：设置字体样式(normal正常，italic斜体，oblique倾斜)-font-size：设置文本的字号大小(设置文本的大小，值可以是绝对或相对值，其中绝对值从小到大依次xx-small、x-small、small、medium（默认）、large、x-large、xx-large；单位可以是pt或em，也可以采用百分比（%）的形式)-font-variant：设定小型大写字母(normal（正常）、small-caps（小型大写字母）)-font-weight:设置字体粗细(bolder（特粗体）、bold（粗体）、normal（正常）、lighter（细体）或100~900之间的9个等级)-font:属性的简写可用于一次设置元素字体的两个或更多方面，书写顺序font-style、font-variant、font-weight、font-size/line-height,font-family
  • 文本格式属性
-text-align：文本水平对齐方式（left、right、center、justify）
-vertical-align：文本垂直对齐方式（bottom、top、middle、baseline）-line-height：设置文本的行间距（三种单位：像素px，相对值em和百分比%）
-letter-spacing：定义字符的间距（默认为normal）
-text-indent属性用于设置首行文本的缩进。属性值可为不同单位的数值、em字符宽度的倍数、或相对于浏览器窗口宽度的百分比%，允许使用负值, 建议使用em作为设置单位。-text-transform：属性用于控制英文字符的大小写。（可用属性值如下：none：不转换默认值。capitalize：首字母大写。uppercase：全部字符转换为大写。lowercase：全部字符转换为小写。）-text-decoration：属性用于设置文本的下划线，上划线，删除线等修饰效果。
（可用属性值如下：none：没有装饰（正常文本默认值）。underline：下划线。overline：上划线。line-through：删除线。）
（设置修饰线的样式，取值solid（实线）、double(双线）、dotted（点状线条）、dashed（虚线）、wavy(波浪线）-text-shadow属性可以为页面中的文本添加阴影效果。
常用子属性为：
h-shadow用于设置水平阴影的距离；
v-shadow用于设置垂直阴影的距离；
blur用于设置模糊半径；
color用于设置阴影颜色。 
综合设置text-shadow属性取值的语法格式为： text-shadow:h-shadow v-shadow blur color
  • 文本对齐属性
text-align属性是将块级标签以及单元格里面的文本内容进行相应的对齐。属性取值可以是：left、right、center、justify。
vertical-align属性是将行内元素一级单元格里面的文本内容进行相应的对齐。属性取值可以是：bottom、top、middle、baseline。
如果希望将块级元素内的文本设置为垂直居中，这里介绍一个巧妙的方法就是将文本行高line-height与块级元素的height值设置一样。
  • 文本加粗的属性
font-weight设置字体的粗细，取值可以是bolder（特粗体）、bold（粗体）、normal（正常）、lighter（细体）或100~900之间的9个等级。
  • 颜色表示

在前端程序开发中，颜色的表示方式常见的有如下三种：

表示方式表示含义取值
关键字预定义的颜色名red、green、blue…
rgb表示法红绿蓝三原色，每项取值范围：0-255rgb(0,0,0)、rgb(255,255,255)、rgb(255,0,0)
十六进制表示法#开头，将数字转换成十六进制表示#000000、#ff0000、#cccccc，简写：#000、#ccc
2.背景样式属性
background-color：设置元素的背景颜色background-image:url(背景图像的路径)：设置元素的背景图像，取值格式为url(背景图像的路径)background-size：设置元素的背景图像大小。取值为cover时，会保持图像的纵横比并将图像缩放成将完全覆盖背景定位区域的最小大小；取值为contain时，会保持图像的纵横比并将图像缩放成将适合背景定位区域的最大大小；取值为长度值，第一个参数设置宽度，第二个参数设置高度，两个参数之间空格分隔。background-repeat：设置元素的背景平铺方式。取值为no-repeat表示不平铺；取值为repeat-x表示横向平铺；取值为repeat-y表示纵向平铺；取值为repeat表示双向平铺。background-position：设置图像在背景中的位置，取值：top、bottom、left、
right、center或具体值、百分比background-attachmen：设置背景图像是否随页面内容一起滚动，取值scroll（滚动）、fixed（固定）
3.页面布局
盒子模型

  • 盒子：页面中所有的元素（标签），都可以看做是一个 盒子，由盒子将页面中的元素包含在一个矩形区域内，通过盒子的视角更方便的进行页面布局

  • 盒子模型组成：内容区域（content）、内边距区域（padding）、边框区域（border）、外边距区域（margin）

image-20230821111612165

布局标签

  • 布局标签：实际开发网页中，会大量频繁的使用 div 和 span 这两个没有语义的布局标签。

  • 标签：

  • 特点：

    • div标签：

      • 一行只显示一个（独占一行）

      • 宽度默认是父元素的宽度，高度默认由内容撑开

      • 可以设置宽高（width、height）

    • span标签：

      • 一行可以显示多个

      • 宽度和高度默认由内容撑开

      • 不可以设置宽高（width、height）

image-20230821112742902

内容区布局

内容区（content）是盒子模型的中心，包含了盒子的 主要信息内容

内容区拥有width、 height和overflow三个属性，其中overflow属性用于当 content中的信息太多，并超出内容区所占的范围时，通过 该属性来指定溢出内容的处理方式，属性取值如下：

image-20231227173156928

4.边框属性

边框（border）是指围绕元素的内容和内边距的一条或 多条线，拥有border-width 、border-style、 border-color 、 border-radius、 border-image 、box-shadow等属性

边框Border的属性可以分别对top（顶部）、right （右边）、bottom （底部）、left（左边） 进行设置，例如：
{border-top-width：10px；}。
{border-width：10px 20px 30px 40px;}。
➢当边框宽度有3个参数时，将按“上→左+右→下”的顺序作用到边框上
➢当边框宽度有2个参数时，将按“上+下→左+右”的顺序作用到边框上
➢当边框宽度有1个参数时，四个方向的边框宽度取值相同
  • border-style属性
border-style属性取值可以为：none（无边框）、dotted（点状线）、dashed（虚线）、solid（实线）、double（双线）、groove（3D凹陷型）、ridge（3D凸起型）、 inset（ 3D凹边）、 outset（ 3D凸边）
  • border-radius属性
border-radius属性可以设置左上角、右上角、右下角、左下角的圆角样式。
需要设置圆角的水平半径HR和垂直半径VR的大小。
➢ 水平半径与垂直半径相等时，设置一个参数即可，如
{border-top-left-radius:8px;}
➢ 水平半径与垂直半径不相等时，需先设置水平半径，再设垂直半径，如
{border-top-left-radius:8px 20px;}
  • border-image属性
border-image属性用于对元素的图像边框进行统一设置，取值情况相对较复杂。可分别设置border-image-source（图像的路径）、border-image-slice（图像分割方式，设置图像边框向内偏移）、border-image-width（图像边框宽度）、 border-image-repeat（设置图像平铺方式）。也可以统一设置，格式如下：border-image : url(图像的路径) 
图像分割方式/图像边框宽度
图像平铺方式
5.网页元素的定位属性

网页元素的定位分为：普通流，浮动和绝对定位

  • 元素的浮动

元素的浮动是指设置了浮动属性的元素会脱离标准文档流 的控制，移动到其父元素中指定位置的过程。浮动的盒子可以左 右移动，直到它的边缘碰到包含框或另一个浮动盒子框的边缘。

选择器 {float:属性值}
属性值：left，right，none

由于浮动元素不再占用原文档流中的位置，所以会对页面 中其他元素的排版产生影响，如果要避免这种影响，就需要对元 素清除浮动。

选择器 {clear:属性值}
属性值：
left 不允许左侧有浮动元素（清除左侧浮动的影响）
right 不允许右侧有浮动元素（清除右侧浮动的影响）
both 同时清除左右两侧浮动的影响
  • 元素的定位

定位模式

选择器 {position:属性值;}属性值：
relative:相对位置
absolute：绝对位置
fixed：固定位置

边偏移

选择器{边偏移属性:属性值；}
属性值：
top，bottom，left，right

image-20240713113616212

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

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

相关文章

在HTML中使用JavaScript

在HTML中使用JavaScript

在 HTML 中使用 JavaScript 有以下几种常见的方式&#xff1a; 一、内联脚本 &#xff08;一&#xff09;基本语法 内联脚本是将 JavaScript 代码直接嵌入到 HTML 文件的 <script> 标签内部。 <!DOCTYPE html> <html lang"en"> <head> <…
阅读更多...
R语言安装devtools包失败过程总结

R语言安装devtools包失败过程总结

R语言安装devtools包时&#xff0c;遇到usethis包总是安装失败&#xff0c;现总结如下方法&#xff0c;亲测可有效 一、usethis包及cli包安装问题 首先&#xff0c;Install.packages("usethis")出现如下错误&#xff0c;定位到是这个cli包出现问题 载入需要的程辑包…
阅读更多...
深层神经网络示例

深层神经网络示例

输出层采用sigmoid&#xff0c;隐藏层采用tanh import numpy as np # 设置一些画图相关的参数 import matplotlib.pyplot as pltplt.rcParams[figure.figsize] (5.0, 4.0) plt.rcParams[image.interpolation] nearest plt.rcParams[image.cmap] gray from project_03.utils…
阅读更多...
Oracle 19c和23ai都有哪些变化

Oracle 19c和23ai都有哪些变化

Oracle版本新特性 Oracle 19c和Oracle 23ai&#xff0c;最为官方长期支持的两个版本&#xff0c;一个是目前生产环境使用最多的新版本&#xff08;笔者运维环境&#xff09;&#xff0c;一个是目前官方发布的最新版本数据库&#xff0c;两者在各自版本的功能和特性方面都有着比…
阅读更多...
护网HW面试—apacheiisnginx中间件解析漏洞篇

护网HW面试—apacheiisnginx中间件解析漏洞篇

参考&#xff1a;Apache/IIS/Nginx中间件解析漏洞_分别说出iis、apache、nginx解析漏洞原理-CSDN博客 一、apache 1、Apache HTTPD 换行解析漏洞 Apache HTTPD是一款HTTP服务器&#xff0c;它可以通过mod_php来运行PHP网页。 其2.4.0~2.4.29版本中存在一个解析漏洞。 在解…
阅读更多...
永磁同步电机控制算法--基于 SVM 的无磁链环 DTC

永磁同步电机控制算法--基于 SVM 的无磁链环 DTC

永磁同步电机无磁链环 DTC 通过控制定子磁链交轴分量来直接控制转矩&#xff0c;不再要求控制磁链幅值恒定&#xff0c;省去了传统 DTC 中的磁链环&#xff0c;不仅转矩响应更快&#xff0c;有效抑制了转矩脉动&#xff0c;而且提高了电机功率因数。但无磁链环 DTC 方案仍采用传…
阅读更多...
TCPDump协议分析工具

TCPDump协议分析工具

TCPDump协议分析工具 TCPDump是一个强大的命令行工具&#xff0c;用于捕获和分析网络数据包。它能够实时监控和记录网络流量&#xff0c;帮助网络管理员和安全专家排查网络问题、分析流量和检测网络攻击。以下是TCPDump的详细介绍&#xff0c;包括其安装、基本使用、过滤规则和…
阅读更多...
YOWOv2(yowov2)动作识别+Fastreid身份识别 详细安装与实现

YOWOv2(yowov2)动作识别+Fastreid身份识别 详细安装与实现

首先yowov2是一款简单且实时的时空动作检测方案&#xff0c;fastreid是行人重识别&#xff08;身份识别&#xff09; yowov2介绍链接直达fastreid链接直达为时空动作检测任务设计实时框架仍然是一个挑战。YOWOv2 提出了一种新颖的实时动作检测框架&#xff0c;利用三维骨干和二…
阅读更多...
Python|OpenCV-实现人物的姿态识别检测以及实时计数(18)

Python|OpenCV-实现人物的姿态识别检测以及实时计数(18)

前言 本文是该专栏的第20篇，后面将持续分享OpenCV计算机视觉的干货知识，记得关注。 本文将基于OpenCV以及MediaPipe，来实现视频与摄像头中的人物，进行仰卧起坐的动态检测以及实时计数（本文进行人物的姿态识别，仅以人物的仰卧起坐的动态动作为例）。 具体细节部分以及完…
阅读更多...
【Js】导出 HTML 为 Word 文档

【Js】导出 HTML 为 Word 文档

在 Web 开发中&#xff0c;有时我们希望用户能够将网页上的 HTML 内容保存为 Word 文档&#xff0c;以便更方便地分享和打印。 html样式 word文档 工具准备 1、 html-docx-js - npm html-docx-js是一个 JavaScript 库&#xff0c;用于将 HTML 内容转换为 Word 文档的格式。它…
阅读更多...
在Linux系统实现瑞芯微RK3588部署rknntoolkit2进行模型转换

在Linux系统实现瑞芯微RK3588部署rknntoolkit2进行模型转换

一、首先要先安装一个虚拟的环境 安装Miniconda包 Miniconda的官网链接：Minidonda官网 下载好放在要操作的linux系统，我用的是远程服务器的linux系统，我放在whl这个文件夹里面，这个文件夹是我自己创建的 运行安装 安装的操作都是yes就可以了 检查是否安装成功,输入下面…
阅读更多...
【CEEMDAN-VMD-CNN-LSTM】双重分解+卷积神经网络+长短期记忆神经网络多变量回归预测，多变量输入模型

【CEEMDAN-VMD-CNN-LSTM】双重分解+卷积神经网络+长短期记忆神经网络多变量回归预测，多变量输入模型

双重分解&#xff08;Dual Decomposition&#xff09;、卷积神经网络&#xff08;Convolutional Neural Network&#xff0c;CNN&#xff09;和长短期记忆神经网络&#xff08;Long Short-Term Memory&#xff0c;LSTM&#xff09;结合的多变量回归预测需要详细的实现和数据情况…
阅读更多...
【香菇带你学Linux】Linux环境下gcc编译安装【建议收藏】

【香菇带你学Linux】Linux环境下gcc编译安装【建议收藏】

文章目录 0. 前言1. 安装前准备工作1.1 创建weihu用户1.2 安装依赖包1.2.1 安装 GMP1.2.2 安装MPFR1.2.3 安装MPC 2. gcc10.0.1版本安装3. 报错解决3. 1. wget下载报错 4. 参考文档 0. 前言 gcc&#xff08;GNU Compiler Collection&#xff09;是GNU项目的一部分&#xff0c;…
阅读更多...
在unity的ECS框架中SystemAPI.Time.DeltaTime的值如何确定

在unity的ECS框架中SystemAPI.Time.DeltaTime的值如何确定

在Unity的ECS&#xff08;Entity Component System&#xff09;框架中&#xff0c;SystemAPI.Time.DeltaTime 是一个用于获取上一帧所花费时间的值。这个值是通过Unity的 Time.deltaTime 来确定的&#xff0c;但在ECS框架中&#xff0c;它被封装在 SystemAPI.Time 命名空间下&a…
阅读更多...
埋点系统如何统计用户的平均停留时长？

埋点系统如何统计用户的平均停留时长？

Hello&#xff0c;大家好&#xff0c;欢迎使用Webfunny前端监控和埋点系统。 今天&#xff0c;我们将介绍webfunny的埋点系统如何统计用户的平均停留时长 一、页面beforeLeave事件 当你页面离开的时候&#xff0c;会触发一个心跳检测&#xff0c;但是这个可能不是100%触发&am…
阅读更多...
C# Static的一些理解

C# Static的一些理解

静态类 一、静态类 　　静态类与非静态类的重要区别在于静态类不能实例化&#xff0c;也就是说&#xff0c;不能使用 new 关键字创建静态类类型的变量。在声明一个类时使用static关键字&#xff0c;具有两个方面的意义&#xff1a;首先&#xff0c;它防止程序员写代码来实例化…
阅读更多...
各向异性含水层中地下水三维流基本微分方程的推导（二）

各向异性含水层中地下水三维流基本微分方程的推导（二）

各向异性含水层中地下水三维流基本微分方程的推导 参考文献&#xff1a; [1] 刘欣怡,付小莉.论连续性方程的推导及几种形式转换的方法[J].力学与实践,2023,45(02):469-474. 书接上回&#xff1a; 我们能得到三个方向的流入流出平衡方程&#xff1a; ∂ ρ u x ∂ x d x d y d…
阅读更多...
Linux 下 redis 集群部署

Linux 下 redis 集群部署

目录 1. redis下载 2. 环境准备 3. redis部署 3.1 修改系统配置文件 3.2 开放端口 3.3 安装 redis 3.4 验证 本文将以三台服务器为例&#xff0c;介绍在 linux 系统下redis的部署方式。 1. redis下载 下载地址&#xff1a;Index of /releases/ 选择需要的介质下载&am…
阅读更多...
MUX-VLAN基本概述

MUX-VLAN基本概述

1&#xff09;技术背景&#xff1a; 在企业网络中&#xff0c;各个部门之间网络需要相互独立&#xff0c;通常使用VLAN技术可以实现这一要求。如果企业规模很大&#xff0c;且拥有大量的合作伙伴&#xff0c;要求各个合作伙伴之间能够访问公司服务器&#xff0c;但是不能相互访…
阅读更多...
【常见开发问题】阿里云无法登录的问题

【常见开发问题】阿里云无法登录的问题

&#x1f49d;&#x1f49d;&#x1f49d;欢迎来到我的博客&#xff0c;很高兴能够在这里和您见面&#xff01;希望您在这里可以感受到一份轻松愉快的氛围&#xff0c;不仅可以获得有趣的内容和知识&#xff0c;也可以畅所欲言、分享您的想法和见解。 推荐:kwan 的首页,持续学…
阅读更多...
最新文章

Copyright @ 2022~2023