我的前端学习笔记-HTML篇

HTML

web标准：结构（HTML） 表现（css） 行为（js）

目录

HTML

基本标签结构

图像标签的使用

 相对路径;

绝对路径：

链接及特殊字符

表格属性

无序列表（重点）

有序列表（理解）

自定义列表（重点）

表单标签

表单元素 type属性​

label标签

select下拉表单​

---

<br \> 单标签很少见
<hr>标签是定义水平线

基本标签结构

输入“！”在按下tab键或回车，直接生成代码骨架

图像标签的使用

1、*.html 文件跟 *.jpg 在不同目录下，例如：

<img src="/images/2.jpg" width="270" height="400"/>

2、*.html 文件跟 *.jpg 图片在相同目录下

<img src="图片名.jpg" width="300" height="120"/>

 3、*.html 文件跟 *.jpg 图片在不同目录下：
a、图片 *.jpg 在 image 文件夹中，*.html 跟 image 在同一目录下：

<img src="image/*.jpg/"width="300" height="120"/>

b、图片 *.jpg 在 image 文件夹中，*.html 在 connage 文件夹中，image 跟 connage 在同一目录下：

<img src="../image/*.jpg/"width="300" height="120"/>

4、如果图片来源于网络，那么写绝对路径：

<img src="http://static.runoob.com/images/runoob-logo.png" width="300" height="120"/>

 相对路径;

绝对路径：

图片源自绝对路径 <br />
<img src="E:\喻言\453088537.jpg" width="300" height="400"/><br />
1 2

链接及特殊字符

表格属性

跨行合并: rowspan= " 合并单元格的个数”
跨列合并: colspan='合并单元格的个数"

无序列表（重点）

li {
/* 消除无序列表的小圆点 */
list-style: none;
}

有序列表（理解）

自定义列表（重点）

表单标签

用来收集用户信息： 包括：表单域 表单控件（元素） 提示信息

表单元素 type属性

label标签

select下拉表单

<input type="text" name="username" value="学历"> <br>
/* 表单内是黑色实体文字*/

 

 <input type="text" name="serchforcioure" placeholder="请输入关键词">
/* placeholder 表明文字是背景，虚化*/

---

下一篇关于CSS，还有案例