2020.12.22 赵一鸣
1.知识点总结
1.6 常见的标签
1.6.0.5 列表
有序列表
- li 是 list item 的首字母缩写
- li 表示列表项目(列表条目)
type="1" 数字风格表示列表顺序
type="a" 小写字母风格表示列表顺序
type="i" 罗马数字风格表示列表顺序
无序列表
- 无序列表 和 有序列表内部的 列表项目 都使用 li 元素来表示
- 无序列表 和 有序列表内部的 列表项目 都使用 li 元素来表示
type="disc" 实心圆表示列表顺序 type="square" 矩形表示列表顺序
type="circle" 空心圆表示列表顺序
定义列表
- 标题
- 对标题的描述
1.6.0.6 表格
表格由标签来定义。每个表格均有若干行（由标签定义），每行被分割为若干单元格（由标签定义）
例如：
| 11 | 12 | 13 |
| 21 | 22 | 23 |
1.6.0.7 表单
插入图片
<img src="">
插入音频
三种方式
1.本地
2.在线
3.base64
插入视频
echarts
代码例如
<meta charset="utf-8">
<title>echarts</title>
<!-- css 样式 -->
<style>
/* css选择器中的 id选择器 */
#echarts{
width: 800px;
height: 800px;
}
</style>
<!-- 1.引入echarts的js -->
<script src="js/echarts.min.js"></script>
<!-- 引入 echarts 主题-->
<script src="js/macarons.js"></script>
</head>
<body>
<!-- 2.容器 -->
<div id="echarts"></div>
<!-- 自定义的 js -->
<script>
/*
echarts 使用：
1. 引入 echarts.js 文件
2. 设置 echarts 容器
3. 自定 echarts 配置
4. 设置 echarts 配置
*/
// 获取到 echarts 容器
var div = document.querySelector("#echarts");
// 初始化 echarts
var myChart = echarts.init(div,'macarons');
// 3. echarts 配置
// 指定图表的配置项和数据
option = {
xAxis: {
type: 'category',
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
},
yAxis: {
type: 'value'
},
series: [{
data: [120, 200, 150, 80, 70, 110, 130],
type: 'bar'
}]
};
// 4. 设置 option
myChart.setOption(option);
</script>
2.心得体会
今天学习了表格和表单的编写方式，还做了两个实验。有序列表和无序列表的练习比较简单，而表格练习稍有难度，后来经过老师的演示，发现是我想复杂了。
而图片和视频的插入则比较简单，比较新奇的是解锁了base64加密解码，感觉很厉害，尤其不明白HTML为什么能读懂base64加密。再后来学习了echarts，感觉很难一头雾水，后面虽然经过了老师的演示，但是还是看不大懂，不过在我的练习下，稍微懂了一点。最后看了一些好像是数据库之类的东西，感觉更难了。不过我相信，明天一定会更好。
近期评论