一、基本结构
<!Doctype html> <!-- 声明:当前的文档使用的是HTML5的技术规范 -->
<html><!-- 根标记,表示网页文件的开始 -->
<head>
<!-- 头部信息,该部分的浏览内容不在浏览器中显示 -->
</head>
<body>
<!-- 主体部分,浏览器窗口中要显示的内容基本都在此部分 -->
</body>
</html><!-- 表示网页文件的结束 -->
1.<meta>属于单标签,其作用是用户通过meta设置的信息来检索到这个网页,可以这么说meta标签是给浏览器看的。
2.<link>属于单标签,其作用是定义文档与外部资源的关系和链接外部样式表
3.设置页面颜色<style>
body{
background-color: green;
}
</style>
4.<body>是身体,内容展示的区域<body>
<!Doctype heml>
<html>
<head>
<meta charset="UTF-8"/><!-- 字符集的声明 -->
<title>欢迎来到我的网站</title><!-- 网页的标题,显示在标题栏上 -->
<meta name="author" content="张三"/><!-- 作者 -->
<meta name="description" content="这里写关于网站的描述"/>
<meta name="keywords" content="网站的关键词,可以设置多个关键词1,用逗号分割即可"/>
<link rel="stylesheet" href=""><!-- 链接外部样式表 -->
<!-- 内部样式表 -->
<style>
body{
background-color: green;
}
</style>
</head>
<body>
</body>
</html>
二、背景标签
在头部添加
<style>
body{
background-color: (color);
}
</style>
三、文本标签
标题标签:
<h1></h1> 对齐属性align="center" center居中 1--6
段落标签:
<p></p> 对齐属性align="center" center居中
字体标签:
<font></font> 属性:颜色color=""
字体face="(中文)"
字号size=""
分割线:
<hr> 属性:颜色color=""
粗细size=""
宽度width="" 可以具体,可以比例
文本格式化:
加粗: b strong
倾斜: i em
下划线: u ins
删除线: s del
特殊字符:
空格 大于号 > 小于号 <
换行符:
br 单标记,强制换行
四、图像标签
<img src="" alt="" />
img 单标记,src写图像的存放路径,border为边框
alt替换文本,图像不能正常显示时才会出现
title为提示文本,鼠标移动到图像上面才会出现
width 宽,height高,一般情况两个值只给其中一个
vspace为距离上方距离
五、列表
定义列表
<dl>(表示这是定义列表)
<dt>(定义的对象)
<dd>(说明)
<dd>
</dt>
<dl>
有序列表
<ol>(声明这是一个有序列表) (属性:type选择编号类型,start=""从第几项开始编号)
<li> (内容)</li>
<ol>
简便方法
ol>li*5 包含
h1+p*5 并列
无序列表
<ul>(声明这是一个无序列表) 属性:type="" (编号类型)
<li> (内容) </li>
</ul>
六、超链接
<a href="(要跳转的网址)">(进行超链接的对象)</a>
超链接的对象可以是数字、图片、列表,可以跳转本地,也可以跳转到外部网址
锚记链接
1.先在目标位置做id标记
2.然后在菜单上做超链接,目标位置的id名前加#
七、表格
<table> //定义这个表格 属性:border(边界宽) width、height
<tr> //表格的行
<td> //表格的列 align
</td>
<th> //文字格式为加粗居中
</th> //
<th> colspan跨列合并 rowspan跨行合并
</th>
</tr>
</table>
注意:表格合并一般在2及以上,并且做到合一删一
<table> cellspacing框线 cellpadding文字与框的距离
</table> cellspacing框与框的距离,当框距为0,框线也就为1