第二天

补充之前

---

 标题标签有<h1>--<h6>

特点：文字加粗、文字变大，h1-h6逐渐减小、独占一行

段落标签<p></p>
特点段落之间存在间隙、独占一行。

<br>单标签、让文字强制换行。

<hr>单标签、在页面中显示一条水平线。

插入图片<img src=” ” alt=” ”>单标签

属性名：alt
属性值：替换文本
图片加载失败，显示alt的文本，反之则不显示

属性名：title
属性值：提示文本
当鼠标悬停时，才显示文本
注意:title属性不仅仅可以用于图片标签，还可以用于其他标签。

图片标签的width和height
属性名：width和height
属性值：宽度和高度（数字）

相对路径：从当前文件开始出发找目标文件

同级目录：当前文件和目标文件在一个目录中

下级目录：目标文件在下级目录中

上级目录的写法是：../
可以直接写目标文件

 

音频audio但是一些浏览器不支持自动播放

controls显示播放控件

autoplay为自动播放（但是部分浏览器不支持自动播放）

loop为循环播放

音频标签目前支持3种格式：MP3,Wav，Ogg

 

视频video

controls 显示播放控件

autoplay 自动播放（谷歌浏览器需要配合muted静音播放）

muted 静音播放

 

链接标签为<a href="./目标网页.html">超链接</a>
#为空链接
href的作用是跳转地址
target=属性表示调整：
_self默认值，在当前窗口中跳转（覆盖原网页）
_blank在新网页跳转

无序列表ul

<ul>

<li> </li>

<li> </li>

<li> </li>

</ul>

 

有序列表ol

<ol>

<li> </li>

<li> </li>

<li> </li>

</ol>

自定义列表dl

<dl>

<dt> </dt>

<dd> </dd>

<dd> </dd>

<dd> </dd>

</dl>

 

表格table属性：

border 边框宽度

width 表格宽度

height 表格高度

<caption> 表格标题 </caption>

<th>加黑加粗效果</th>

 

表格结构

thead 表格头部

tbody 表格主体

tfoot 表格底部

 

合并单元格

跨行合并（垂直）rowspan

跨列合并（水平）colspan

上下合并，保留最上

左右合并，保留最左

 

输入框 input

text文本框

password密码框

radio单选框 （name 属性分组，一个分组只能有一个值被选中checked 默认选中）

checkbox多选框（checked 默认选中）

file文件选择（multiple 多选）

submit提交

reset重置

button按钮

placeholder 占位符提示

需要配合 form 表单域使用

属性 value 修改按钮显示的值

 

select下拉菜单
<select>
<option> </option>
<option> </option>
<option selected> </option>
</select>
option 选项
默认选中第一项，可以指定默认选中 selected

<textarea>多行文本域</textarea>

label点击文字也可选中选项
<input type="radio" name="sex" id="man" /> <label for="man">男</label>
<label><input type="radio" name="sex" />女</label>

 

div 块级标签，独占一行
span 行内标签
header 网页头部
nav 网页导航
footer 网页底部
aside 网页侧边栏
section 网页区块
article 网页文章

空格 &nbsp;
版权符&copy;

---

（1）内嵌式

• CSS 写在 style 标签中
• style 标签可以写在页面任意位置，一般放在 head 标签中

（2）外链式

• CSS 写在单独的.css文件中
• 通过 link 标签引入到网页中

（3）行内式

• CSS 写在标签 style 属性中

 

字体大小font-size:  16px;

字体粗细font-weight: 400;

字体样式font-style: normal;（italic倾斜）

字体系列font-family: 微软雅黑, 黑体, sans-serif;（一般网站使用的是无衬线）

文本缩进text-indent: 2em;

文本对齐text-align: center;（left默认左 right右）

文本修饰text-decoration: none;常用于a标签清除下划线
              text-decoration：underline;下划线
              text-decoration：overline;上划线
              text-decoration：line-through;删除线

行高line-height: 1.5;or line-height: 50px;