一、什么是HTML?
超文本标记语言
包含了头部(head)和主体(body)两大部分
head 主要是浏览器和搜索引擎看的
body 用户主要看到的内容都在这
二、什么是DOCTYPE?
它是文档类型声明(HTML文档),它一般写在文档的第一行,html标签之前。
DOCTYPE分为html5类型和html4类型
html5 所有html类型的文档都用这种方式定义
html4 三种类型:严格,过度,框架。90%在使用的都是过度类型。
三、HTML的基础标签
——html的基本结构
<!DOCTYPE html>
<html>
<head>
<mate charset="UTF-8" />
<title></title>
</head>
<body>
</body>
</html>
常见基本标签:
body bgcoclor 背景颜色 background背景色
h1~h6 标题 align的属性值 left center ringht
justify两端对齐,通过firebug可以和left对比出效果
p标签 里面的空格和换行会被浏览器自动忽略,可以加
让它换行
这是一个段落,
这又是一个段落
span标签 一般放一些短小的文字,或是结合背景图片做一些效果
div布局 里面包含了一组元素,可将页面切分为不同的部分
br 换行符
hr 水平分割线 width=”50%” size=”20” align=”center”
格式标签
address 文档的联系信息,地址 斜体显示
b标签 粗体效果
del标签 删除的效果
em 强调 斜体
i 纯粹的斜体显示文本
pre 标签 会保留空格和换行
small标签 小号字体
big标签 大号字体
strong 强调 显示为粗体 strong>em
u标签 一个下划线
sup 上标
sub 下标
图像标签img
alt=”无法显示的提示” title=”鼠标划过显示文字”
src=”图片的路径” width=”100” hight=”100”(单位不写默认为px)
border边框 align和h标签汇总的用法不同,需要和文本作为参考来显示
a href=”” 没有href无法跳转到链接页面 title=”“鼠标划过
如果href里的属性值为#,那么它指的是跳转到页面顶部
target属性定义了链接以什么方式打开 target=”_blank”在新的页面打开
列表
有序 无序 定义
ol 定义一个有序列表
- a A i I
ul 定义一个无序列表
- disc实心圆 cicle空心圆 square方块
dl定义列表
-
第一章
- 1小节
- 2小节
- 3小节
块元素和行元素
一般html页面中的元素分为两种,一种是块元素一种是行元素
【块元素和行元素的区别】
1、块元素独占一行,它可以设置宽和高;在未设置的情况下,块元素已浏览器的宽为宽
2、一行可放置多个行元素,不可以设置宽和高,img除外,行元素以元素内容的宽和高为准
常见的行元素和块元素
内联元素(inline element)
* a - 锚点
* b - 粗体(不推荐)
* big - 大字体
* em - 强调
* font - 字体设定(不推荐)
* i - 斜体
* img - 图片(行内元素,但可设置宽高)
* label - 提示标签
* select - 列表选择
* small - 小字体文本
* span - 常用内联容器,定义文本内区块
* strong - 粗体强调
* sub - 下标
* sup - 上标
* textarea - 多行文本输入框
* u - 下划线
块元素(block element)
* address - 地址
* div - 常用块容器
* dl - 定义列表
* fieldset - 元素集
* form - 交互表单
* h1 - h6 标题
* hr - 水平分隔线
* ol - 有序列表
* p - 段落
* pre - 格式化文本
* table - 表格
* ul - 无序列表
input 是行内块元素