1.HTML：
HTML：超文本标签语言（标签又称标记、元素）。
浏览器：“解释和执行”HTML源码的工具 （运行网页的工具APP）。
客户端：享受服务的计算机
服务器：提供服务的计算机

2、基本框架（网页最小结构）

<html>

<head>

<title>网页标题</title>

</head>

<body>

网页内容：这是网页的最小结构

</body>

</html>

3、<head> 头部

（1）<title>网页标题:网页摘要信息利于浏览器解析和搜索引擎搜索
（2）<meta />   数据元 文档的信息描述
[1]描述文档类型和字符编码
[2]描述搜索：关键字和描述

注：charset编码方式——w3c web网页语言 统一规范 网页 全世界 utf-8、只想服务 于国内 例如 eg:中文 编码 该gbk gb2312

例如：

<head>

<title>淘宝网</title>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<meta name= "keywords" content= "淘宝,网上购物,交易市场" />

<meta name= "description" content= "淘宝网，提供各类服饰、美容、家居、数码、……" />

</head>

4、<body>身体，网页内容（可以是文本、图像等 ）

5、HTML标签分类
块级标签：显示为“块”状，前后隔一行 ，一块里可以包含多行【独占一行、能够控制的内、外边距 、宽度浏览器始终是一样大的、display:block 默认block】

行级标签：按行逐一显示 ，一行中可以包含图文内容。【默认不换行文本内容都在同一行上面、高，行高及外边距和内边距部分可改变、display:inline; 默认是行内元素inline】
分类好处：方便布局设计

6、块级标签
（1）基本块级标签
<h1>—<h6>:标题标签，<h1>最大，<h6>最小 —— h1只能在页面出现一次， 出现多次不利于我们的页面排名，多的认为作弊，不利于搜索引擎搜索
<p>:定义段落
<hr />:定义水平线

（2）用于布局的块级标签
[1]有序列表：默认为阿拉伯数字
<ol>
<li>列表项</li>
</ol>
[2]无序列表：默认为小圆点
<ul>
<li>列表项</li>
</ul>
[3]描述标签
<dl>
<dt>描述标题</dt>
<dd>描述内容</dd>
</dl>
[4]表格标签:<table>\表格行<tr>\表格列（单元格）<td>
<table>
<tr>
<td>单元格内容</td>
<td>单元格内容</td>
</tr>
</table>

[5]表单标签：<form>
<form method="post|get" action="url地址">
表单内容
</form>

[6]块标签：<div>作为容器来使用

7、行级标签
图片标签：<img src="图片路径" alt="图片不显示的提示文字" title="鼠标悬浮提示文字" align="对齐方式" />—— alt  提供给搜索引擎抓取，align图后文字对其方式-值可为居图中absmiddle,right,left，宽高-width/height

范围标签：<span> </span>

换行标签：<br />   不建议使用

字体标签：<font> 作用改变文字字体内容 不建议使用 【size = "文字大小" color ="文字颜色"】。如果只是为了修饰文本 就可以使用

（1）strong b 标记的区别

strong 文字显示粗体状态 强调 文章中的某一些重要词 SEO收录有一定影响 对我们站点排在百度首页有一定影响
b 文字显示粗体状态 没有什么大的作用只是修饰页面字体而已

（2）em i 标记的区别

em 斜体 强调（相对strong来说弱一点） SEO页面有一定作用

i 斜体 没有强调 用在项目里面比较多

预格式化文本标签 ——<pre>、<meta>、<mark>、<small>

<pre> 作用：保持文本原有的格式

文本移动标记：<marquee >         由于没有语义、代码多，现在已经被w3c抛弃 
a1. direction滚动方向　　默认向左"left"    right右 down下 up上

a2.文本背景 bgcolor="red"

a3.behavior滚动方式　　scroll  默认向左一直滚动，slide,单向一次停止,来回走alernate

a4.loop 循环次数 　　 loop="自定义次数" 如果true 无限循环

a5.scrollAmount="速度值" 文本速度值

a6.鼠标移入停止  onmouseover=this(指的是marquee当前标记).stop() 停止,鼠标移入marquee让它自己停止动画

a7.鼠标移出执行动画 动起来 onmouseout=this.start() 开始动

8、XHTML的基本规范
（1）标签名和属性名称必须小写

（2）HTML标签必须关闭
（3）
标签必须正确嵌套
（4）必须添加文档类型声明 【!DOCTYPE】
（5）属性值必须用引号括起来

9、实际开发的4种块状结构
（1）div-ul(ol)-li ：常用于分类导航或菜单等
（2）div-dl-dt-dd ：常用于图文混编的场合
（3）table-tr-td ：常用于图文布局或显示数据
（4）form-table-tr-td：常用于布局表单

第一章 HTML基本标签的更多相关文章

  1. WEB的进击之路-第一章 HTML基本标签（1）

    一.HTML简介 超文本标记语言,标准通用标记语言下的一个应用. "超文本"就是指页面内可以包含图片.链接,甚至音乐.程序等非文字元素. 超文本标记语言的结构包括"头&q ...

  2. [OpenGL红宝书]第一章 OpenGL概述

    第一章 OpenGL概述 标签(空格分隔): OpenGL 第一章 OpenGL概述 1 什么是OpenGL 2 初识OpenGL程序 3 OpenGL语法 4 OpenGL渲染管线 41 准备向Op ...

  3. 《Django By Example》第一章 中文 翻译 （个人学习，渣翻）

    书籍出处:https://www.packtpub.com/web-development/django-example 原作者:Antonio Melé (译者注:本人目前在杭州某家互联网公司工作, ...

  4. 《Entity Framework 6 Recipes》翻译系列(2) -----第一章 开始使用实体框架之使用介绍

    Visual Studio 我们在Windows平台上开发应用程序使用的工具主要是Visual Studio.这个集成开发环境已经演化了很多年,从一个简单的C++编辑器和编译器到一个高度集成.支持软件 ...

  5. Asp.Net MVC4 + Oracle + EasyUI 学习 第一章

    Asp.Net MVC4 + Oracle + EasyUI  第一章 --操作数据和验证 本文链接:http://www.cnblogs.com/likeli/p/4234238.html 文章集合 ...

  6. 【vue.js权威指南】读书笔记（第一章）

    最近在读新书<vue.js权威指南>,一边读,一边把笔记整理下来,方便自己以后温故知新,也希望能把自己的读书心得分享给大家. [第1章:遇见vue.js] vue.js是什么? vue.j ...

  7. SpringMVC从入门到精通之第一章

    第一节 简介:SpringMVC是Spring框架的一个模块,Spring和SpringMVC无需通过中间整合层进行整合.SpringMVC是基于MVC的WEB框架.MVC设计模式在B/S下的应用: ...

  8. 精通Web Analytics 2.0 （3） 第一章：网站分析的新奇世界

    精通Web Analytics 2.0 : 用户中心科学与在线统计艺术 第一章:Web Analytics 2.0的新奇世界 多年以来,我们很清楚的知道,网站分析能够真正的改革网络上业务的完成方式.那 ...

  9. 《css3实战》读书笔记 第一章 基于CSS需求而编写的HTML.

    笔记说明 <CSS3实战手册第3版(影印版)>可以消除Web设计工作的痛苦,并且带给你:HTML--重新入门.如果你是HTML新手,你会学到如何以CSS友好的方式进行基本页面构造.若你是H ...

随机推荐

  1. Badboy测试工具官网下载以及安装导出Jmeter脚本

    首先打开浏览器,在百度上搜索“Badboy ”,默认搜索到的第一个就是官网地址: 1 也可以在其他软件下载网址上进行下载 2 点击进入后,官网左侧菜单中有“download”字样,或者官网右侧顶部也有 ...

  2. 安装graphlab伤透了心，终于搞定了

    为了方便研究各种机器学习算法,我想用graphlab来辅助我对后续算法的研究.所以我的目标就是安装graphlab到我的windows笔记本中.而基于python的graphlab的安装最好是采用如下 ...

  3. 20165336 实验二 Java面向对象程序设计

    20165336 实验二 Java面向对象程序设计 一.实验报告封面 课程:Java程序设计 班级:1653班 姓名:康志强 学号:20165336 指导教师:娄嘉鹏 实验日期:2018年4月16日 ...

  4. DevOps理论与实践总结

    DevOps指导理论与实践 [第01篇]:郭宏泽:全开源架构下的DevOps实践(转) SonarQube应用指南 [第一篇]:SonarQube Scanner报svn: E170001错误 che ...

  5. Java如何对List集合的操作方法(一)

    目录: list中添加,获取,删除元素: list中是否包含某个元素: list中根据索引将元素数值改变(替换): list中查看(判断)元素的索引: 根据元素索引位置进行的判断: 利用list中索引 ...

  6. js面向对象、创建对象的工厂模式、构造函数模式、原型链模式

    JS面向对象编程(转载) 什么是面向对象编程(OOP)?用对象的思想去写代码,就是面向对象编程. 面向对象编程的特点 抽象:抓住核心问题 封装:只能通过对象来访问方法 继承:从已有对象上继承出新的对象 ...

  7. 4.0-uC/OS-III目录结构

    本文章都是基于学习野火STMF4系列的开发板的学习做的,大部分都是开发手册的内容,做笔记用,具体请参考野火官方的开发手册. 1. uC/OS-III 文件结构 ①配置文件,通过定义这些文件里宏的值可以 ...

  8. 【托业】【新托业TOEIC新题型真题】学习笔记8-题库五->P7

    ———————————————————单词———————————————————— minister 部长 construction contractor 施工方 commence 开始:着手 bac ...

  9. 前端 HTML标签属性

    HTML标签可以设置属性,如下: <div id="i1">这是一个div标签</div> <p class='p1 p2 p3'>这是一个段落 ...

  10. css自动换行如何设置?url太长会撑开页面

    我们更新文章时如果有引用其他文章一般会带一个原文url,但这个链接如果太长的话会把内容的版块撑开,整个排版乱了.那我们能不能设置css自动换行呢?如下图所示,其实只要两个样式就能搞定 word-wra ...