HTML
一什么是HTML
超文本标记语言,{最基础的网络语言}。
二.常用的网络名词
1. WWW 万维网
2. URL 统一资源定位器, 网址,路径
3. HTTP 超文本传输协议
4. W3C 万维网联盟(组织) 制定一系列规范
三 HTML的骨架(基本结构)
<html>
<head>
<title></title>
</head>
<body>
用户能够看到的内容
</body>
</html>
六.HTML的语法
1. 单标记 <标签名/> 例如:<br />
2. 双标记 <开始标记></结束标记> 例如:<body> </body>
七. 常用标记
1. h1-h6 标题标记 注意:h标记不是用来控制文字大小,是控制标题等级。
2. br 换行 折行
3. p 段落
4. hr 水平线
5. b strong 字体加粗
6. i em 字体倾斜
7. del 删除线
8. u 下划线
strong,em 是带有语气和语意的标记,在描述重要的文本时使用
八. 网页的基本元素
1. 文字 2. 图片 3. 链接
注意:当听到html标签,标记,元素,节点时,都是一个意思。
九.插入图片
<img src=”图片的路径” />
<标签名 属性=”属性值” />
Img里的属性
-
src 图片来源
-
alt 替换文本(当图片不能正常显示时)
-
title 图片标题
-
width 设置图片宽度
-
height 设置图片高度
-
border 图片的边框
注意:代码中所有的标点符号必须在英文输入法状态下书写!!!
十.路径
1. 绝对路径:带有盘符的和完整的网络地址
eg:F:\day01\1.jpg http://www.baidu.cn/1.jpg
2. 相对路径: 不带有盘符并且不能跨盘符
eg:img/1.jpg
注意: ../跳出上一级文件夹 ../../跳出上两级文件夹
十一. 注释
注释是给编写代码的人员看的,页面中不显示。
<!–要注释的内容–>
十二. body里的属性
-
bgcolor 背景颜色
-
background 背景图片
十三. 特殊字符
1. 空格
2. > 大于号
3.< 小于号
4.© 版权
5.® 注册
十四.a链接
<a href=”链接的地址”></a>
A链接里的属性
-
Href 在自己的窗口打开。
-
target=”_blank” 新窗口打开
链接的种类
-
本地链接 href=”../day02/01-特殊字符.html”
-
网络地址链接 href=”http://www.baidu.cn”
-
空连接 假链接 href=”#”
-
图片链接 <a href=”要链接的地址”><img src=”图片路径”</a>
-
锚点链接 <a href=”#id名”></a>
十五.列表
1. 无序列表
<ul>—声明无序列表
<li></li>—列表项
<li></li>—(li可以有多个)
</ul>
2. 有序列表
<ol>—声明有序列表
<li></li>—列表项
<li></li>–(li可以有多个)
</ol>
3. 定义列表(自定义列表)
<dl>—声明定义列表
<dt></dt> — 项目名称
<dd></dd> —对项目的描述(dd可以有多个)
</dl>
十六. 表格
1. 表格的基本结构
<table> — 声明表格
<tr> —- 行
<td></td> —列
</tr>
</table>
(注意:表格里要存放的内容都在td里)
2. table里的属性
1. border 边框
2. width 宽
3. height 高
4. align 水平对齐方式 left左 center 居中right 右
5. bgcolor 背景颜色
6. background 背景图片
7. cellspacing 单元格与单元格之间的距离
8. cellpadding 内容与单元格之间的距离
3. tr里的属性
1. height 高度
2. bgcolor 背景色
3. background 背景图片
4. aligin 水平对齐方式 left 左 center 居中 right 右
5. valign 垂直对齐方式 top上 middle中 bottom下
4. td里的属性
1. height 高度
2. bgcolor 背景色
3. background 背景图片
4. aligin水平对齐方式 left 左 center 居中 right 右
5. valign 垂直对齐方式top上 middle中 bottom下
6. width 宽度
7. colspan 跨列
8. rowspan 跨行
十七.表单
1. 声明表单
<form action=”表单提交地址” method=”表单提交方式” name=”表单的名字”></form>
2. 表单元素
1. 文本框 <input type=”text” name=”” value=”” />
2. 密码框 <input type=”password” name=”” />
3. 单选按钮 <input type=”radio” name=”” value=”” />
4. 多选按钮 <input type=”checkbox” name=”” value=”” /> 默认被选中属性:checked=”checked”
5. 上传文件 <input type=”file” name=”” />
6.下拉选项 <select name=” “>
<option value=” “></option>
</select>
例如:城市 <select name=”city”>
<option value=” “>–请选择城市–</option>
<option value=”bj”>–北京–</option>
<option value=”sh”>–上海–</option>
</select>
7.多行文本(文本域)
<textarea rows=”” cols=””></textarea>
例如:自我介绍:<text rows=”10″ cols=”20″>>/textarea>
代码里自动默认的单位是像素!