01_html基础1

一个初学web的菜鸟，如有不足和缺陷敬请谅解！

web的产品划分

b/s结构 => B/S（Browser/Server）结构即浏览器和服务器结构。

c/s结构 => C/S(Client/Server) 结构即客户机和服务器)结构

web的定义=> 页面

1.html(超文本标记语言): 结构 网页整体的架子 类似于没有装修过的毛坯房

2.css(层叠样式表): 表现　　网页样式的体现　　类似于房子的装修过程

3.JavaScript(脚本语言): 行为　　网页的功能实现　　具体是用户与页面的交互

html概述(Hyper Text Markup Language)

　　全称：超文本标记语言

　　　　　　不算编程语言: 通常编程语言包括数据结构+算法+API

h5的基本结构：

 

 

2. 语法：

<包裹标签名>

划分:

　　　　<标签名>　　单标签

　　　　<标签名>内容</标签名>　　双标签

　　　　单标签的 / 可以省略 双标签的则不能

　　　　元素=标签+内容

　　　　<title></title>　　 title标签

　　　　<title>hello</title>　　 title元素 盒子

3.常见的有自带不同特点的标签

　　h1-h6 标题标签: 加大加粗文本 独占一行显示
　　i 斜体
　　u 下划线
　　s 删除线
　　b 加粗
　　sub 下标 化学方程式
　　sup 上标 数学表达式
　　上面6个都是共享一行
　　p 上下有间距 独占一行的
　　hr 分隔线
　　br 换行

最常见没有特点

 　　div　　独占一行

　　span　　共享一行

注意：

　　默认浏览器很小气 编辑n个空格回车默认就显示一个空格符

　　解决办法：转义字符

　　常见的转义字符：

　　　　　　　　　　空格 &nbsp;

　　　　　　　　　　< &lt;
　　　　　　　　　　> &gt;
　　　　　　　　　　© &copy;

4、注释方式

　　注释按键：ctrl + ?

　　注释的样式：<!--　　注释内容　　-->

5、公共的属性和值（常见）

　　id属性　　值必须唯一　　一般结合js用

　　title　　鼠标移入时的文本提示

　　class　　结合css使用　　匹配对应相对的类选择器名称

　　style　　内联式属性　　修饰当前元素的样式：背景、颜色、边框、高、宽等

　　　　　　style="　　属性1="值"　属性2="值2"　……"

　　align:设置居中样式的属性　　值有：left　　center　　right

　　特点：只有独占一行的元素才可以使用　　共享一行的元素无法使用

6、img图片

　　结构：<img　　/>

　　属性：

　　　　src：图像引入的地址

　　　　alt：图像没有引入成功显示的文本

　　　　width：宽

　　　　height：高

　　　　注意：如果宽高只给一个值　图片会按照　等比例缩放进行处理