性别html5代码 html设置性别

转载

落花流水人家 2024-07-01 06:03:15

文章标签 性别html5代码 html 表单 HTML 单选框 文章分类 HTML5 移动开发

HTML+CSS基础知识简单版

一、HTML概述

HTML：超文本标记语言，其实就是用来开发网页的一门语言；
CSS：层叠样式表，可以用于渲染网页、美化网页、做网页。

1、HTML介绍

HTML：超文本标记语言

超文本：超过文本、超级文本；
HTML不仅可以包含文本，还可以包含图片、音频、视频等各种格式的文件；
标记：标签、元素，指的是用尖括号括起来的一组内容，例如：<div>,<img>,<h1>,</h1>,</div>等。
其实就是用于开发网页的一门语言。

关于HTML:

HTML开发的网页文档，通常是以.htm、.html为后缀。
HTML开发的网页文档，可以通过浏览器打开并显示（浏览器就是一个HTML解析器）。
HTML本质就是一个文档。

2、HTML结构

<!-- 用于声明当前文档是一个html格式的网页,并且版本是html5.0版本 -->
<!DOCTYPE html>
<!-- 根标签,所有的HTML内容都应该放在根标签内部 -->
<html>
	<!-- 头部分,用于存放网页的基本属性信息(例如网页标题,网页编码,引入的css样式,js文件等) -->
	<head>
		<!-- 通知浏览器当前使用的编码,若不指定可能会出现乱码现象 -->
		<meta charset="utf-8">
		<!-- 用于指定网页标签的标题 -->
		<title>我的第一个测试网页</title>
	</head>
	<!-- 体部分,用于存放网页的可视化内容 -->
	<body>
		<!-- h1、h2等用于指定网页内容的标题 -->
		<h1 align="center" style="color: crimson;">欲戴王冠,必承其重<br>One who wants to wear the crown,bears the crown</h1>
		<h2 align="center" style="color: crimson;">欲戴王冠,必承其重<br>One who wants to wear the crown,bears the crown</h2>
		<h3 align="center" style="color: crimson;">欲戴王冠,必承其重<br>One who wants to wear the crown,bears the crown</h3>
		<h4 align="center" style="color: crimson;">欲戴王冠,必承其重<br>One who wants to wear the crown,bears the crown</h4>
		<h5 align="center" style="color: crimson;">欲戴王冠,必承其重<br>One who wants to wear the crown,bears the crown</h5>
		<h6 align="center" style="color: crimson;">欲戴王冠,必承其重<br>One who wants to wear the crown,bears the crown</h6>
		<!-- 生成一条水平线，边框为5px实线红色 -->
		<hr style="border: 5px solid red;"/>
		
	</body>
</html>

3、HTML语法

标签、标记、元素：就是用尖括号（<>）括起来的一组内容，例如：<head>、<body>、<h1>、<img>、<a>等。标签由开始标签()和结束标签()组成, 开始和结束标签之间可以包含其他的内容。
自闭标签：有些标签内部不需要写内容，通常可以写成自闭标签。例如：
<br/> 、<hr/>、 <input/>、 <img/>、 <meta/>等
属性：
<input type="text" id="username" class="xxx"/>

属性必须要声明在标签上,不能独立存在
属性可以声明多个,多个属性之间可以用空格隔开
属性的值可以使用双引号或者单引号引起来.
<input type="text" id="username"/><input type='text' id='username'/><img src="xx" id="xx" name="xx"/><img src='xx' id='xx' name='xx'/>

注释格式： 注释作用：（1）为代码添加解释说明 ;(2)将一些暂时不需要执行的代码注释。
空格和换行
在html中,多个连续的空白字符(空格/换行/制表符)会被解析成一个空格来显示。

如果要实现多个空格,可以使用  或 &emsp;
如果要做换行,可以使用 <br/>标签;

二、HTML标签

1、图像标签

img标签可以在网页中插入一幅图像,例如：
<img src="img/meinv01.jpg" width="40%"/> 其中,src属性: 用于指向图片的路径(相对路径,网络路径)

width属性: 指定图片的宽度
height属性: 指定图片的高度

关于路径问题:

不建议写带盘符的绝对路径,因为将来换一个发布环境,这个路径很可能是错的,所以不建议
<img src="D:/JavaDevelop/HBuilderProjects/CGB-HTMLCSS-01/img/meinv02.jpg" width="40%"/>
建议写相对路径
./: 表示当前文件所在的位置,可以省略不写
…/: 表示当前文件所在目录的上一级目录

<img src="./img/meinv01.jpg" width="40%"/> 表示在当前文件(html)所在的目录找img目录,在目录下找meinv01.jpg文件

2、超链接标签

a标签用于在网页中实现一个超链接
点击超链接后,会跳转到另外一个位置(网页、图片、下载地址等),例如:
<a href="http://www.baidu.com" target="_blank">百度一下,你就不知道</a>

其中href属性,用于指向所跳转到的url地址
target属性,用于指向以何种方式打开超链接

self: 在当前窗口打开超链接
blank: 在新窗口中打开超链接

3、表格标签

table: 用于定义一个表格,其中可以包含tr标签
tr(table row): 用于定义表格中的行, tr中可以包含td/th
td/th(table data cell): 用于定义表格中的单元格
th(table header cell): 用于定义表头中的单元格，其中的文本默认会加粗并且居中。
colspan属性：设置单元格横跨的列数,例如:
<td colspan="2">11</td>
colspan=“2”: 设置当前单元格横跨两列
rowspan属性：设置单元格竖跨的行数
<td rowspan="2">21</td> rowspan=“2”: 设置当前单元格竖跨两行

4、表单标签

4.1.表单的作用

表单的作用: 用于向服务器发送数据
向服务器发送数据的两种方式:
1)使用表单向服务器发送数据
表单中往往存在表单项标签(用户名、密码、昵称、邮箱、验证码等)，在表单项中可以输入数据，再提交表单就可以将输入的数据提交给相应的服务器。
2)使用超链接也可以向服务器发送数据
http://www.baidu.com?user=张三&age=20&like=篮球 在URL地址后面可以拼接问号,问号之前是url地址,问号之后可以拼接参数,参数包括参数名(user，age，like)，和参数值（张三，20，篮球）,多个参数之间用&分隔。在输入地址后访问服务器,就可以将地址后面拼接的参数一并带给服务器

4.2.form标签

<form action="http://www.baidu.com" method="GET|POST"> ... </form> 其中action属性:用于指定表单中的数据将会提交到哪个地址。
例如：action属性指向百度服务器的网址，就意味着，表单中的所有数据都会提交到百度服务器。
method属性:指定提交方式,常用提交方式为GET和POST(区别后面会讲到)
如果不指定method,默认是GET提交。

5、表单项标签

1)文本输入框(用户名/验证码/邮箱/昵称)
<input type="text" name="username"/><input type="text" name="email"/><input type="text" name="nickname"/> 2)密码输入框(密码/确认密码)
<input type="password" name="psw"/><input type="password" name="repsw"/>

3)单选框(性别/单选题选项)
<input type="radio" name="gender"/>男<input type="radio" name="gender"/>女 4)多选框/复选框(多选题选项/岗位/爱好)
<input type="checkbox" name="like"/>篮球

5)下拉选框(省份/城市/市区选择)
<select name="prov"> <option>北京市</option> <option>上海市</option> <option>广东省</option> ... </select>

6)多行文本输入框
<textarea name="desc"></textarea>

7)按钮/提交按钮
<input type="button" value="换一张"/> 普通按钮本身没有功能,可以通过js为按钮添加功能(比如点击后,换一张图片)

<input type="submit" value="提交/登录/注册"/> 提交按钮用于提交表单,将表单中的数据提交给action属性所指向的服务器。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>欢迎注册</title>
		<!-- style标签内部用于书写css样式、css注释 -->
		<style>
			*{/* 选中所有元素 */
				font-family: "微软雅黑";
			}
			table,td,th{/* 设置边框 */
				border: 2px solid red;
				border-collapse: collapse;
			}
			table{/* 设置位置 */
				/* 设置背景 */
				background-color: lightgray;
				/* 设置左右外边距自适应(始终保持相等) */
				margin-left: auto;
				margin-right: auto;
			}
			td,th{
				/* 设置内边距(元素边框和内容之间的距离) */
				padding: 5px;
			}
			h1{
				text-align: center;
			}
		</style>
	</head>
	<body>
		<h1>欢迎注册</h1>
		<table>
			<tr>
				<td>用户名:</td>
				<td><input type="text"/></td>
			</tr>
			<tr>
				<td>密码:</td>
				<td><input type="password"/></td>
			</tr>
			<tr>
				<td>性别:</td>
				<td>
					<input type="radio" value="boy" checked name="sex"/>男
					<input type="radio" value="girl" name="sex"/>女
				</td>
			</tr>
			<tr>
				<td>爱好:</td>
				<td>
					<input type="checkbox" value="basketball" name="hobby" />篮球
					<input type="checkbox" value="basketball" checked name="hobby" />足球
					<input type="checkbox" value="basketball" name="hobby" />排球
				</td>
			</tr>
			<tr>
				<td>城市</td>
				<td>
					<select>
						<option value="beijing">北京</option>
						<option value="guangzhou" selected="">广州</option>
						<option value="shenzhen">深圳</option>
						<option value="shanghai">上海</option>
					</select>
				</td>
			</tr>
			<tr>
				<td>自我描述:</td>
				<td>
					<textarea name="desc" cols="30" rows="5" placeholder="请输入描述信息...">
					</textarea>
				</td>
			</tr>
			<tr>
				<td colspan="2" style="text-align: center;">
						<input type="submit" value="提交" />
				</td>
			</tr>
		</table>
	</body>
</html>

6、表单细节问题

1、提交表单时，表单中的数据为什么没有被提交？

对于表单中的表单项标签，只要是需要向服务器提交数据，该表单项上必须添加name属性；如果表单项标签上没有name属性，在表单提交时，该项将会被忽略。例如：

<input type="text" name="username"/>
<input type="password" name="psw"/>

2、如何让多个单选框只能有一个被选中？

要求多个单选框必须具有相同的name属性值，如果多个单选框name属性值相同，则说明是一个组的内容，一个组中的单选框只能选择其中的一个！

<td>性别:</td>
<td>
    <input type="radio" name="gender"/>男
    <input type="radio" name="gender"/>女
</td>

3、为什么单选框、复选框选择某一项后提交的值都是on?

因为单选框、复选框只能选择，不同于用户名、密码输入框，可以输入内容。

因此我们需要通过value属性为单选框或复选框设置提交的值(如果不设置默认值都是on)，例如：

<input type="radio" name="gender" value="male"/>男
<input type="radio" name="gender" value="female"/>女

4、如何设置单选框或复选框默认选中某一项?

可以在单选框或复选框标签上添加一个checked="checked"属性，就可以让当前单选框或复选框默认被选中。例如：

<input type="radio" checked="checked" name="gender" value="male"/>男
<input type="radio" name="gender" value="female"/>女
<!-- 爱好复选框/多选框 -->
<input type="checkbox" name="like" value="basketball"/>篮球
<input type="checkbox" checked="checked" name="like" value="football"/>足球
<input type="checkbox" name="like" value="volleyball"/>排球

5、如何设置下拉选框默认选中某一项?

在option标签上添加一个selected="selected"属性，可以让当前option选项默认被选中，例：

<select name="city">
    <option>北京</option>
    <option>上海</option>
    <option selected="selected">广州</option>
    <option>深圳</option>
</select>

6、下拉选框中option选项上的value属性的作用是什么？

<select name="city">
	<option value="beijing">北京</option>
	<option value="shanghai">上海</option>
	<option selected="selected">广州</option>
	<option>深圳</option>
</select>

如果某一个选项被选中，并且该选项上添加了value属性，在提交表单时，将会提交value属性的值。

如果某一个选项被选中，该选项上没有添加value属性，在提交表单时，将会提交标签中的内容

7、其他标签

在html5之前，大多数的音频和视频是通过插件（比如flash）来播放的，html5规定了一种通过 audio和video元素来包含音频和视频的标准方法。

1、audio标签（html5）

audio标签能够播放声音文件或者音频流，例如：

<audio controls src="audio/沙漠骆驼_展展与罗罗.mp3"></audio>

其中audio标签的属性：

src属性：用于指定要播放的音频的URL地址
controls="controls"：为用户显示播放控件，比如播放、暂停和音量控制等
autoplay="autoplay"：音频在就绪后马上播放（自动播放）
loop="loop"：当音频完成播放后，再次开始播放（循环播放）
width、height：设置音频播放器的宽度和高度

<audio> 与 </audio> 之间插入的内容是供不支持 audio 元素的浏览器显示的

<audio controls src="audio/沙漠骆驼_展展与罗罗.mp3">
	如果您可以看到此内容，说明您的浏览器不支持此标签!
</audio>

2、video标签（html5）

video标签能够播放视频流，目前支持三种视频格式：MPEG4、Ogg、WebM。

<video controls src="video/小芳_李荣浩版.mp4"  width="50%"></video>

其中video标签的属性：

src属性：用于指定要播放的视频的URL地址
controls="controls"：为用户显示播放控件，比如播放、暂停和音量控制等
autoplay="autoplay"：视频在就绪后马上播放（自动播放）
loop="loop"：当视频完成播放后，再次开始播放（循环播放）
width、height：设置视频播放器的宽度和高度

<video> 与 </video> 之间插入的内容是供不支持 audio 元素的浏览器显示的（这里不再给出示例）

3、div、span、p标签

div、span、p元素都是非常普通、但是又很常用的标签，它们都是容器标签，可以用来包裹其他元素或文本，将样式添加在这些元素上，就可以为包含在其中的内容设置样式。

div、p：块元素，默认独占一行，可以设置宽高（其中div元素通常用于布局，而p元素通常用于定义段落）

span：行内元素，行内元素可以显示在同一行，不可以设置宽高（span用于包含文本或组合行内元素，以便于统一设置样式）

4、header、footer标签（html5）

<header>标签定义文档的页眉（介绍信息）或页面的头部分

<footer>标签定义文档或节的页脚。页脚通常包含文档的作者、版权信息、使用条款链接、联系信息等等。

三、 CSS概述

1、什么是CSS

CSS：层叠样式表，用于修饰、渲染网页的一门技术

使用css样式修饰网页，可以实现将设置样式的css代码和展示数据的html代码进行分离，增强了网页的展示能力。

2、如何在html中引入CSS

2.1.在标签上的style属性内部添加css样式
`

这是一个div…

` 这种方式是将css样式直接写在标签上的style属性内部,只对当前标签有效,无法实现代码的复用,而且容易造成页面结构的混乱,不利于后期的扩展和维护。所以不建议大量使用。

2.2.在head标签内的style标签内部添加css样式
<style type="text/css"> span{ border:2px solid green; /* 设置字体大小 */ font-size:30px; /* 设置字体粗细 */ font-weight:bolder; } </style> 这种方式是将所有的css样式在一个style标签内部统一管理,没有将css代码写在标签上,因此不会造成页面结构的混乱,而且可以实现代码的复用

2.3.通过link标签引入外部的css文件
 <link rel="stylesheet" href="demo.css"/> 这种方式是将所有的css代码写在一个css文件中统一管理,真正的实现了: 将html代码和CSS代码进行分离。可以实现代码的复用，也不会造成页面结构的混乱。
推荐使用这种方式(特别是在企业开发中)

四、CSS选择器

所谓的选择器就是能够在html中帮助我们选中元素进行修饰的一门技术。

1、标签名选择器

通过元素名称(或标签名称)选中指定名称的所有标签

格式: 元素名/标签名{ css样式… }

/* ----- 1.标签名选择器练习 ----- 
将所有span标签的背景颜色设置为#efbdef, 设置字体大小为22px，字体加粗；*/
span{ /* 选中所有的span元素 */
	background-color:#efbdef; 
	font-size: 22px;
	font-weight: bolder;
}

2、class选择器

可以为元素添加一个通用的属性 – class，通过class属性为元素设置所属的组，class值相同的元素则为一组。通过class值可以选中这一组的元素，为元素添加样式。

格式：.class值{ css样式… }

实例:

/* ----- 2.类选择器练习 ----- 
(1)将所有的span（但是不包括div和p标签下的span）的背景颜色设置为#faf77b，边框改为2px solid cyan；
(2)将div下的span和内容为"span111"的span，背景颜色设置为#5eff1e、字体颜色设置
#ec0e7e；*/
.s1{ /* 选中所有class值为s1的元素 */
	background: #faf77b;
	border: 2px solid cyan;
}
.s2{ /* 选中所有class值为s2的元素 */
	background: #5eff1e;
	color: #ec0e7e;
}

另外，一个元素也可以设置多个class值，多个class值中间用空格分隔，例如：

<span class="s1 s2" >span111</span>

表示当前元素同时属于多个分组，多个分组上设置的样式也会同时作用在当前元素上。

如果多个分组设置了相同的样式（但是值不一样），样式会发生冲突，写在后面的样式会覆盖前面的样式！

内容补充：选择器优先级顺序：

（1）如果是同一类选择器，同时给某些元素设置了样式，如果样式冲突了，那么写在后面的样式会覆盖前面的样式。

（2）如果是不同的选择器，设置的样式优先级顺序是：id选择器(100) > 类选择器(10) > 元素名选择器(1)

3、id选择器

通过标签上通用的属性id，可以为标签设置一个独一无二的编号（id值应该是唯一的），通过id值可以唯一的选中一个元素。

格式：#id值{ css样式 }

/* ----- 选择器练习 -----
用id选择器将第一个p标签设置字体大小为24px，字体颜色为#a06649, 首行文本缩进20px。*/
#p1{ /* 选中id值为p1的元素 */
	font-size:24px;
	color: #a06649;
	text-indent: 20px;
}

<p id="p1">这是一个p元素!!!</p>

4、后代选择器

选中指定元素内部的指定后代元素

格式: 祖先后代{ css样式… }

/* ----- 4.后代选择器练习 ----- 
为p元素内部的所有span元素，设置字体大小为18px,字体颜色为红色,背景颜色为pink;*/
p span{ /* 匹配所有p元素内部的所有span元素 */
	font-size:18px;
	color: red;
	background: pink;
}
/* p,span{} 匹配所有的p元素和所有的span元素 */

<p id="p1">
	这是一个p元素!!!
	<span>这是一个span元素!!!</span>
</p>

5、属性选择器

在选择器选中元素的基础上，根据元素的属性条件筛选/过滤元素

格式：选择器[属性条件1][属性条件2]…{ css样式 }

/* ----- 5.属性选择器 ----- 
为所有的文本输入框，设置背景颜色为#FF7CCC、字体大小22px，首行文本缩进15px；*/
input[type='text']{ /* 匹配所有的input并且type值为text的元素 */
	background: #FF7CCC;
	font-size: 22px;
	text-indent: 15px;
}
input[type='text'][name='email']{ 
	/* 选中所有的input并且type值为text、并且name为email的元素 */
	background : yellow;
}

五、常用属性总结

1、文本属性

1、text-align：设置元素内的文本水平对齐方式，其常用取值为:

left: 默认值。左对齐
right: 右对齐
center: 居中对齐
justify: 两端对齐

2、text-decoration：设置文本的下划线样式，其常用取值为:

underline: 有下划线
none: 没有下划线

3、text-indent：设置文本首行缩进，单位: 像素/百分比

4、letter-spacing：设置字符间隔/间距，其常用取值为:

normal
像素值

5、text-shadow：设置字体阴影，其取值为:

像素值 像素值 像素值 颜色值
第一个值为阴影水平位移，第二个值为阴影垂直位移，第三个值为阴影扩散值，第四个值为阴影颜色

2、字体属性

font-size：设置字体大小

font-weight：设置字体粗细 normal、bold、bolder 100/200/300…/900

font-family：设置字体，比如微软雅黑、黑体、楷体等

color：设置字体颜色

3、背景属性

background-color：设置背景颜色

background-image：设置背景图片，url(‘图片的路径’);

background-repeat：设置或检索对象的背景图片是否及如何排列，常用取值：

repeat(默认值,重复排列)
repeat-x(横向重复排列,但纵向不重复)
repaet-y(纵向重复排列,但横向不重复)
no-repeat(不重复)

background-position：设置或检索对象的背景图片位置

background: 背景颜色背景图片背景图片是否重复背景图片的位置

4、边框（border）

border:2px solid red; – 设置元素的边框(可以同时设置边框的宽度、样式、颜色)

border属性可以拆分为如下设置:

border-width: 2px; -- 设置元素边框的宽度
border-style: solid; -- 设置元素边框的样式
border-color: red; -- 设置元素边框的颜色

其中border-width、border-style、border-color也可以按照上右下左方向进行拆分，以border-width为例：

border-top-width: 2px; -- 设置上边框的宽度
border-left-width: 2px; -- 设置左边框的宽度
border-right-width: 2px; -- 设置右边框的宽度
border-bottom-width: 2px; -- 设置下边框的宽度

5、其他属性

width：设置元素的宽度

height：设置元素的高

margin: 设置元素的外边距

margin-top: 10px; -- 设置元素的上外边距为10px;
margin-right: 20px; -- 设置元素的右外边距为20px;
margin-bottom: 30px; -- 设置元素的下外边距为30px;
margin-left: 40px; -- 设置元素的左外边距是40px;
---------------------------------------------
margin: 10px 20px 30px 40px; -- 上 右 下 左, 顺时针方向对应
margin: 10px 20px 30px; -- 上 左右 下
margin: 10px 20px; -- 上下 左右
margin: 10px; -- 上下左右都是10px;

6、补充: 颜色设置

颜色取值方式常见的方式有三种:

方式一：设置颜色名，例如：

red、green、blue、yellow、cyan、pink、white、black等

方式二：设置#加上六位的十六进制数值

#FF0000（red）、#00FF00（green）、#0000FF（blue）、#FFFF00（yellow）、#00FFFF（cyan）等

方式三：设置rgb颜色值 ( 课间休息：14：46-15：06 )

rgb(255,0,0) 、rgb(0,255,0) 、rgb(0,0,255) 、rgb(255,255,0) 、rgb(0,255,255) 等
（red） （green） （blue） （yellow） （cyan）

7、display属性

display用来设置元素的类型，常用取值：

block：块级元素的默认值
    默认情况下独占一行
    可以设置宽高
inline：行内元素的默认值
    默认情况下多个行内元素可以处在同一行
    一般不能设置宽高
inline-block：行内块元素
    多个元素既可以显示在同一行, 也可以设置宽和高
none：表示隐藏元素

8、元素类型(了解)

div/span/p 都是一个容器标签，用于包裹其他内容（这些元素本身不具备太多的样式！）

p: 块级元素，默认独占一行，用于包裹一段文本（写文章时用于p标签包裹每一段内容）

div: 块级元素，默认独占一行，用于包裹其他内容，将样式设置在div上，就可以作用在div的内容上。

span：行内元素，默认可以和其他元素显示在同一行。

(1)块级元素（block）

默认情况下，块级元素独占一行

可以设置宽和高，如果设置了就是设置的宽和高

如果不设置宽和高，其中宽是默认填满父元素，而高是由内容决定(由内容支撑)

比如: div/p/h1~h6/form/table 等元素都是块级元素

(2)行内元素（inline）

默认情况下，多个行内元素可以处在同一行

不能设置宽和高

比如: span/input/img/i/b 等元素都是行内元素

(3)行内块元素（inline-block）

既具备行内元素的特征(可以同行显示)，还具备块级元素的特征(可以设置宽和高)

9、扩展

1.CSS选择器分类

全局选择器（通配符*）
标签选择器（body，div，p，ul，li）
类选择器（.）
ID选择器（#）
组合选择器（.head .head_loge，两选择器之间用空格隔开）
后代选择器（#head .nav li ul，从父级到子孙集的选择器）
子选择器（div>p）
群组选择器（div，span，img{color：red；}，即将具有相同样式的标签分组显示）
继承选择器（div p，两选择器用空格键分开）
伪类选择器（链接样式a元素的伪类：:link(未被访问)，:visited(已访问)，:active(被选择)，:hover(当鼠标悬停在链接上)）
字符串匹配的属性选择符（^(开始)，$(中间)，*(结尾)）
css相邻兄弟选择器（如h1+p）

2.CSS选择器优先级

不同级别：！important（在样式属性后不加“;”，在!important后加分号）>行内样式>ID选择器>Class选择器>标签>通配符

相同级别：

（1）同一级别中后写的会覆盖先写的样式
（2）选择器约分

本文章为转载内容，我们尊重原作者对文章享有的著作权。如有内容错误或侵权问题，欢迎原作者联系我们进行内容更正或删除文章。

上一篇：小程序开发工具 out of memory 小程序开发工具手机版

下一篇：在python中d格式的主要用法 python @ddt

提问和评论都可以，用心的回复会被更多人看到评论

发布评论

相关文章

官方博客	全部文章	热门标签	班级博客
了解我们	网站地图	意见反馈

鸿蒙开发者社区	51CTO学堂
51CTO	软考资讯