[前端学习]html部分学习笔记，第一天
2017-08-21 本文已影响0人
印象rcj
网页的简介
- 网页即浏览器显示给用户看的页面，通常这些页面都是浏览器内核把代码渲染后展示出来的效果。一般有文本、图像、链接、音频、视频等元素来组成。
浏览器介绍
- 常用的五大浏览器（按照市场占用率排列）
1.谷歌（内核：blink）；
2.IE|Edge（内核:Trident|EdgeHtml）；
3.safari（内核：webkit）；
4.firefox（内核：Gecko）；
5.opera（内核：blink）。
Web标准
- 正因为各大浏览器的内核不同，为了保证渲染出来的效果一致，w3c推出了web标准。
1.结构标准：用html来书写；
2.样式标准：用css来书写；
3.行为标准：用js来书写。
HTML介绍
- 超文本标记语言，网页中可以包含各种多媒体文件，需要不同的标签来声明。作用是绘制网页结构
html标签
-
标签类型：有单标签和双标签；
-
标签关系：父子关系和并列关系；
-
hmtl骨架（最新H5）:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
</body>
</html>
常用开发工具：
- sublime轻量级；
- webstorm功能强大的IDE工具。
- 一些常用的编辑操作：
- 标签字母+tab 快捷生成标签格式
- html:5+tab 快捷生成html5骨架
- ol>li*5 快捷生成ol标签格式，5个li
字符集：
- 强烈推荐用现在最强大的字符集UTF-8
各种标签：
-
<h1-6></h1-6>标题标签，独占一行，有6个等级。一般h1标签一个页只用一次，用于展示LOGO -
<p></p>段落标签。独占一行 -
<hr />下划线标签 -
<br />换行标签 -
<strong></strong>加粗并强调标签 -
<em></em>倾斜 -
<del></del>删除线 -
<ins></ins>下划线 -
<base target="_blank" />写在head标签中全局设置超链接打开新窗口
标签属性：
- 除了标签必须带的属性之外，例如：
<img src=""><a href="">等等之外，一般不建议过多使用标签属性，建议用CSS来调整样式
锚点定位：
-
同页面锚点定位：
<a href="#锚点名">锚点</a><h2 name="名">跳转点</a>
-
不同页面锚点定位：
<a href="xxxx.html#锚点名">锚点</a><h2 name="名">xxxx.html页面的跳转点</a>
特殊字符：
-
& nbsp;空格 -
& lt;< -
& gt;> - 只记录几个常用的，其他用的时候翻手册。
注释标签
- 注意：注释顾名思义作用是解释代码的，是针对同事或者后续接收人员看代码用的，不显示到页面。
<!- - 注释语句 - ->
路径
-
相对路径（三种情况）：
- 同级路径，使用./调用文件名，例如：
<a href="./文件"></a> - 下级路径，使用/来引导，例如：
<a href="下一级目录名/文件"></a> - 上级路径，使用../（上两级就用../../，以此类推）来引导，例如
<a href="../文件"></a>
- 同级路径，使用./调用文件名，例如：
-
绝对路径：
http://www.itcast.cn/images/logo.gif，包含了完整路径的地址。
