初始认识HTML

一、内核渲染:

• IE: Trident
• firefox: Gecko
• safari: webkit
• chrom: chromium

二、HTML（Hyper Markup Language）便签

1、标签分为两种

• 双标签 <> </>
• 单标签 <br /> 换行 | <hr /> 水平线

2、开发工具

DW | sublime | webstorm | dreamwearer
Hbuilder | visual studio code | FW

3、标签

标题 <hn> </hn>
段落 <p> </p>
粗体 <strong> <b>
斜体 <em> <i>
删除线 <del> <s>
下划线 <u> <ins>
设置整体 <base/>
特殊符号 空格 &nbsp < &lt

4、属性
<hr width = "50" color = "red"/>

• 不分先后,空格隔开
• 都有默认值

5、图片
<img src = "url"/>
属性:

• alt 图片不显示替换文本
• title 鼠标悬停显示文本
• border 边框

6、连接
<a href = "url / #live">
属性:

• href 地址 / # 标识
• target 开发方式(新窗口还是本页跳转)

如锚点定位:

• <a href = "#live"> 个人生活 </a>
• <h2 id = "live"> 个人生活 <h2>

7、路径
绝对路径

• <img src = "C:user/apple...."> (网上的url)

相对路径

• 同一级 src = "图片.jpg"
• 下一级 src = "image/图片.jpg"
• 上一级 src = "../图片.jpg"

8、列表标签
1)无序的 ul

    <li> </li>
</ul>

2)有序的 ol

<ol>
    <li> </li>
</ol>

3)自定义的 dl

<dl>
    <dt> 名词 </dt>
    <dd> 说明 </dd>
<dl>

4)表格

<table>
    <tr> 
        <td>姓名</td>
        <td>性别</td>
    </tr>
</table>

表格属性

• border 边框
• cellspacing (单元格与单元格间距)
• cellpadding (单元格内容与边框的空白间距)
• align (对齐方式)
• 表格标题 <caption> </caption>
• 跨行 rowspan = n (合并单元格)
• 跨列 colspan = n

9、控件 输入框
<input /> 属性

• type = "text" 样式
• name 名字
• value 默认文本值
• size 宽度
• checked 默认选中项
• maxLength 输入的最多字条
• list 名称

10、文本光标
<label> <input ..... /> </label>
<label for = "two"> id = "two"

11、文本域 <textarea>

12、下拉菜单

<select>
    <option> </option>
</select>

13、表单域

<form>
    action = ".PHP"
    method  get/post
 </form>

14、新标签

• 头/页眉 <header>
• 导航栏 <nav>
• 底部 <footer>
• 文章 <article>
• 区域 <selection>
• 侧边 <aside>
• 历史 <datalist>
• 区域块
  <fieldset>
  <legend> 用户登录 </legend>
  </fieldset>

15、多媒体便签
<embed> 嵌入 调兼容