HTML基础 入门、标签讲解
一、入门
一个不需要编译,直接由浏览器执行的文本文件,且必须使用html或htm为文件名后缀,但大小写不敏感,HTML和html一样;它的主要功能就是由浏览器执行向浏览者展示一个页面;
基本语法
<标签名></标签名> 例如:<html></html>
规范:<和>括起来,开始标签和结束标签成对出现,结束标签比开始标签多了一个/,单标签没有结束标签,开始标签为多了一个/,例如:<标签/>
基本结构
<!DOCTYPE html>
<html>
<!-- html文件 -->
<head></head> 头部信息
<body>...</body> 网页内容
</html>
<!DOCTYPE html>声明必须放在HTML文档第一行,用来声明文档类型为html
二、标签讲解
1、常用的基本标签
标题标签:<h1></h1>~<h6></h6>
段落标签:<p></p>
align对齐属性值:
left:左对齐
center:居中对齐
right:右对齐
justify:伸展对齐
换行标签(空标记):<br />
空格标记:
水平线标签:<hr />
width:宽度设置,可以用像素或者百分比
color:颜色设置
align:对齐方式设置
noshade:有无阴影效果设置
2、常用的文字修饰标签
文字斜体:<i></i>、<em></em>
加粗:<b></b>、<strong></strong>
下标:<sub></sub>
上标:<sup></sup>
下划线:<ins></ins>
删除线:<del></del>
3、列表标签
1)无序列表
<ul type="">
<li></li>
<li></li>
...
<li></li>
</ul>
type属性:disc(圆点)、square(正方形)、circle(空心圆)
2)有序列表
<ol type="">
<li></li>
<li></li>
...
<li></li>
</ol>
type属性
1:数字
a:小写字母
A:大写字母
i:小写罗马数字
I:大写罗马数字
2)定义列表
<dl>
<dt>定义列表项</dt>
<dd>列表描述项</dd>
<dd>列表描述项</dd>
...
<dt>定义列表项</dt>
<dd>列表描述项</dd>
</dl>
一个<dl>可以有多个<dt>标签,一个<dt>可以有多个<dd>标签,且<dt>和<dd>是同级标签,互相不可嵌套,并且必须要在<dl>标签内;
在一般开发中,<ul>和<ol>后面的type属性一般用自制图片代替;
4、图像标签
图像标签:<img src="" alt="" ../>
src:URL,显示图像的URL;
alt:文字值,图像替代文本;
height:数值或百分比,图像的高;
width:数值或百分比,图像的宽;
相对路径:从当前网页路径开始的路径;
绝对路径:从根文件开始的路径;
注意:路径文件名尽量用英文表示;
当由于网速太慢、src属性中的错误或者浏览器禁用图像等原因导致用户无法查看图像,alt属性可以代替图像显示在浏览器中的内容;
5、超链接标签
<a href="">内容</a>
href:链接地址,可以是内部链接或外部链接;当href="#"时表示一个空链接;
target:链接目标窗口,常见的有_self、_blank、_top、_parent;
title:链接提示文字;
name:链接命名;
定义锚:定义锚的位置和锚名,设置寻找锚的链接;
<a href="#锚名称">目录</a>
...
<a href="链接地址" name="锚名称">内容</a>
扩展:电子邮件链接
<a href="mailto:邮件地址">...</a>
前端HTML知识比较繁杂,但是也是很常用的,希望大家如果感兴趣的话,可以多多看看网站的源码,自己动手去多实现,我们大家一起加油~