#2022年11月30日
1.Web标准:HTML、CSS、JS(重点)
- HTML:页面元素
- CSS: 修饰样式和美化页面
- JS: 负责页面的交互行为
2.注释(便于其他程序员观看自己的代码)
- 快捷键 —— ctrl+/
3.HTML标签的结构
- 开始标签 + 内容 + 结束标签(双标签)
- 单标签 例如
<br/>
4.标签间关系 父子和兄弟关系
- 父子关系:
<head/>
<title></title>
</head>
- 兄弟关系
<div></div>
<div></div>
5.标签详解
- 标题标签
h1~h5 : 逐渐字体变小 ,文字加粗,独占一行
- 段落标签
p标签 :段落之间默认缝隙,独占一行
- 换行标签
br 单标签
- 水平分割线标签
hr 单标签
- 文本格式化标签
加粗——<b/>
或者<string/>
下划线——<u/>
或者<ins/>
倾斜——<i/>
或者<em/>
删除线——<s>
或者<del/>
- 媒体标签
6.1 图片标签
img 标签——src和alt必备属性(属性之间没有顺序)
可选属性:title(提示文本,鼠标悬停时显示)、width和height(宽和高-写一个自动等比例缩放)
6.2 路径
相对路径(从当前文件出发寻找目标文件)
同级别——直接写文件名或者./加文件名
下级别——./img/(目标文件名)
上级别——../到上级目录
绝对路径(通常从盘符出发 - D:\day01\img\new.jpg)
6.3 音频标签
audio标签——src
可选属性:controls(显示播放音频控件)、autoplay(自动播放,并不是所有浏览器都支持)、loop(循环播放)
6.4 视频标签
video标签——src(指定视频路径)
可选属性:controls(显示播放音频控件)、autoplay(自动播放,谷歌浏览器配合muted实现静音播放)、loop(循环播放)
- 链接标签
a 标签——href属性(代表路径)
可选属性——target(是否在当前窗口跳转 _self在当前窗口,_blank在新窗口)、
- 列表标签
8.1 有序列表
<ol/>
<li>香蕉</li>
<li>苹果</li>
</ol>
8.2 无序列表
<ul/>
<li>香蕉</li>
<li>苹果</li>
</ul>
8.3 自定义列表
<dl/>
<dt>帮助中心</dt>
<dd>关于我们</dd>
</dl>
- 表格标签
table标签
<table/>
<tr>
<td>姓名</td>
<td>成绩</td>
</tr>
</table>
可选属性——border(每个格子是否有边框)