您的位置:首页 > Web前端

学习web前端的历程(二)

2019-07-26 18:02 41 查看
版权声明:本文为博主原创文章,遵循 CC 4.0 by-sa 版权协议,转载请附上原文出处链接和本声明。 本文链接:https://blog.csdn.net/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>      定义插入字
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: