无序与有序列表
一、
无序：
有序：
列表：
换行：
二、改变列表前形状
先给无序列表命名
在head的里面编辑形状【circle，square】
例：
- 香蕉
- 苹果
- 香蕉
- 苹果
- 穿衣服
- 吃饭
三、图标
在iconfont内找到需要的图标：https://www.iconfont.cn/
下载需要的图标，放在img文件中（建议命名为中文）
例：
- 晴
四、文本控制排版
<head> <meta charset="UTF-8"> <title>文本控制排版</title> <link rel="stylesheet" href="css/style.css" /> </head> <body> <h1>任务04</h1> <h2>使用表单制作页面</h2> <h2>4.1任务概述</h2> <p> “新时代、新技能、新梦想”,当前我国大力弘扬劳模精神、劳动精神、工匠精神，旨在激励更多劳动者，特别是青年一代走技能成才、技能报国之路。“新云课堂”项目就是为广大学习者打造的学习知识和技能的平台。</p> <p> 本任务将介绍如何用表单制作“新云课堂”信息登记页面、用户登录页面和用户注册页面。表单对于用户而言是数据录入和提交的界面；表单对于网站而言是获取用户信息的途径。通过在网页中添加表单元素，可以实现如会员注册、登录，问卷调查，在线考试，论坛分享、评论等功能。表单涉及信息的交互，自然离不开数据验证，数据的验证通常使用HTML表单元素与页面中的JavaScript脚本配合实现。但HTML5规范新增了对表单内容的简单验证功能，这一功能大大提升了用户的体验，我们应对其有一个初步的了解。
“新云课堂”项目的用户登录页面、用户注册页面及信息登记页面就需要使用本任务的表单与表单验证来实现。
4.2任务目标
素质目标
- 培养学生的劳动精神和工匠精神。
- 培养学生适应时代要求、主动获取新知识和新技能的意识。
知识目标
- 了解表单元素的定义。
- 掌握语义化表单的制作。
- 了解HTML5属性初步验证表单的功能。
在css中，使列表的序号加括号（自动生成带括号序号）
ol{
list-style: none;
counter-reset: my-counter;
padding-left: 1.5em;
}
li:before{
counter-increment: my-counter;
content: "(" counter(my-counter) ")";
}
ol ：选择所有
- （有序列表）标签。
-
list-style: none; ：隐藏默认的数字序号（比如1.、2.），为自定义样式腾出空间。
-
counter-reset: my-counter; ：初始化一个计数器，名字叫 my-counter ，每次遇到
- 就从0开始计数。
-
padding-left: 1.5em; ：给列表左边加缩进，让内容和序号对齐更美观。
-
- （列表项）内容的前面插入一个伪元素。
-
counter-increment: my-counter; ：每遇到一个
- ，就让计数器 my-counter 加1（从1开始）。
-
content: "("counter(my-counter)")"; ：把计数器的值用括号包起来，生成 (1) 、 (2) 这样的内容，插入到列表项前面。
-
li::before ：在每个
浙公网安备 33010602011771号