Java全栈（四）web 页技术：1.HTML

第1章 页的构成

1.1 概念：B/S 与 C/S

1.1.1 现在的软件开发的整体架构主要分为B/S架构与C/S架构：

• b/s：浏览器/服务器

• c/s：客户端/服务器

客户端：需要安装在系统里，才可使用

浏览器：浏览 页，读取HTML并显示

服务器：处理浏览器的请求

1.1.2 B/S 与 C/S优劣

• b/s只要能上 就能使用，因为基本每台电脑都会有浏览器，维护方便。不需要占用本地储存但会占用 络带宽

• c/s必须安装在系统中，安装成功才可使用。在新的系统中没有安装不能使用，便携性差，维护成本高。需要占用本地储存但不会占用 络带宽

1.1.3 B/S架构技术体系

我们重点是学习BS架构，因为现在企业大多数都是开发B/S架构。而且对于服务端而言，当B/S代码完成后只需要转化为客户端原型即可实现代码的复用。

• HTML文件的结构

  • 为HTML页面中的根标签，所有的HTML 页中的标签都在中。

  • 这里标签用于定义文档的头部，它是所有头部元素的容器。头部元素有、、、 等标签。

  • 在和标签之间的内容是 页的主要内容，如、、、等 页内容标签，在这里的标签中的内容会在浏览器中显示出来。

第3章 HTML语法

• 标签的语法

  • 标签由英文尖括 和 括起来,如：
  • html中的标签一般都是成对出现的,分开始标签和结束标签。结束标签比开始标签多一个 / ,…;还有一些是自结束标签，如：
  • 标签与标签之间是可以嵌套的，但先后顺序必须保持一致，如：里嵌套，那么必须放在的前面。如：
  • 注释是不可以嵌套的,如：
  • HTML标签不区分大小写,和是一样的,但万维 联盟（W3C）建议小写。因为浏览器解析后都会变为小写

• 元素模型

4.2 段落标签

• 作用：段落

• 段落标签也会独占浏览器的一行，而且前后还会空出一行。
• 使用空的段落标记 <p></p> 去插入一个空行是个坏习惯。用 <br />标签代替它！

4.3 换行标签

<br />：是个自结束标签

• 作用：换行

• ul标签中的type可以指定列表前图形的样式。
  • disc【默认值】：实心圆形
  • square：实心方形
  • circle：空心圆形

4.6 有序列表

说明1：如需显示小于 ，我们必须这样写：< 或 <

说明2：使用实体名而不是数字的好处是，名称易于记忆。不过坏处是，浏览器也许并不支持所有实体名称（对实体数字的支持却很好）。

4.10 div标签

• div是html中最灵活最重要的元素，div就像一个容器，里面可以装很多内容。本身没有特殊的语义。

• 它是块级元素，会占用 页的一行。

• Div的主要作用：可以通过调整自己的样式来完成 页的复杂布局

• 它可以把一些独立的逻辑部分(如 页中独立的栏目版块)划分出来，如下图：