学习web前端的历程（二）

最新推荐文章于 2024-08-02 11:13:55 发布

l123zmj

最新推荐文章于 2024-08-02 11:13:55 发布

阅读量144

点赞数 1

CC 4.0 BY-SA版权

文章标签： HTML框架 HTML的元素

本文链接：https://blog.youkuaiyun.com/l123zmj/article/details/97394856

2.HTML的框架和基本元素（标签）

（1）HTML程序的框架

<!DOCTYPE html>
    <html>
    <head lang="en">//里边是语言的设置，en是英文、zh-CN是中文
        <meta charset="UTF-8 ">
        <title> </title>//页面描述性的标题，是必须存在的
    </head>
    <body></body>
    </html>

mata：提供页面有关的元信息（文档的描述和关键字），其只可以放在中，属于元信息标签。
keywords是关键字，可以根据关键字来搜到网页。

<meta name ="keywords" content = " (关键字)">

（2）HTML的常用标签

<p></p>    段落标签（分段）
<hn></hn> 段落标签（标题标签，其与wps的一、二、三级标题类似）
<br/>  换行标签（单标签）
<hr/>  水平线标签
<span></span> 、<div></div>  无语义 代码块标签 （两者的差别就是后者可以只动换行）

字体样式标签

strong></strong>  加粗 语气加重
<b></b>           加粗
<em></em>         斜体
<i></i>           斜体 
<u></u>           下划线
<s></s>           中划线

特殊符号

&nbsp;            为空格；
&lt;              小于号；
&gt；             大于号；
&quot；           引号；
&copy；           版权符号；

图片标签

1.<img/>  其为单标签
2.必须属性 src="(引入图片的存储位置)"
3.常用属性：
width 宽   height 高  单位：像素（px）、百分比（%）
alt  当图片未能显示，用于给用户提供信息
title  鼠标经过时显示的内容
border  边框
例子：
<img src="images/img.jpg"  title="动漫图片" width="30%" height="200px" border="5px" alt="替换文本的属性"/>

超链接

1.<a></a>   超链接标签
2.必须属性： href=" "
3.常用属性：
href     链接URL(链接地址)
target  目标（其属性值_black(在新窗口打开链接地址) 、_self(在当前的窗口打开)）
name    锚点名称（快速跳转到想看的内容）
<a href="#锚点名">（目录的内容）</a> （给大标题）
1. id="锚点名"     （直接给小标题）
2. <a name="锚点名"></a> (直接给小标题)
title    经过鼠标时提示的文字

注意：
1.有开始和结束标签、必有属性src、网站链接地址必须以HPPT：//开头
2.本地链接地址必须加后缀html
3.标签是可以嵌套的
绝对路径：互联网地址格式：http：// 域名
本地地址格式：file：///盘符/目录
相对路径：（相当于自己当前的位置）
（"./ 当前目录"）…/上级目录

水平线标签

<hr/>   单标签
1.属性：
align 水平线 有属性值：center   right    left
width  水平线长度
size  高度
color 颜色
例子：
<hr align="center" width="30%" size="5px" color="black">

格式标签

<adress></adress>  //斜体表示的文字

预文本格式标签

<pre></pre>     //被包围在pre中的元素会保留空格和换行符（原来是什么样子，在网页上看到的也是什么样子）

文本格式化标签

<b></b>             加粗 着重语气字
<strong></strong>   加粗
<em></em>        斜体字 着重语气
<i></i>          斜体字
<u></u>          下划线
<del></del>      删除 ，就如<s></s>
<small></small>  小号字
3<sup>5</sup>    定义上标字 （3^5）
H<sub>2</sub>O   定义下标字 (水的化学式)
<ins></ins>      定义插入字