HTML页面与基本标记

  • HTML是Hypertext Markup Language(超文本标记语言)的缩写,它是构成web页面(page)的主要工具,是用来表示网上信息的符号标记语言。
  • HTML文档由文本和HTML标记组成,通常以.html或者.htm为文本扩展名(如index.html)
  • 浏览器负责翻译HTML文档中的标记,并将HTML文档显示为网页。
  • HTML标记是由浏览器负责执行的,不同的浏览器中网页的显示效果可能不同
  • 大多数浏览器不完全支持HTML的所有特性,每一种浏览器都可能会有一些特有的HTML标记和属性,这些标记和属性可能不会被其他的浏览器识别。这些由软件公司开发的属性和标记被称为HTML扩展,而不是标记的一部分。

HTML标记的基本格式:

<标记>文件内容</标记>

某一些标记还可以包括一些属性:

<标记名称: 属性1 属性2 属性3...>

用来注释的标记:

<!--内容-->

基本结构如下:

<html>
<head>
	网页的标题和属性
</head>
<body>
	文件主体,要显示的内容
</body>
</html>

起始标记<html></html>

<html>标记用于HTML文档的最前面,用来标记HTML文档的开始

</html>则是放在HTML文档的最后面,用来标记HTML文档的结束

必须配对使用

头文件<head></head>

<head></head>标记构成HTML文档的开头部分。在此标记之间可以包含其他标记如

<title>文件标题</title>

主体标记<body></body>

<body></body>标记对之间的内容是HTML文档的主要部分,在此标记对之间可包含众多的标记和信息。

<body>标记可设置如下属性:bgcolor="颜色"(背景颜色)    background="图片地址"(背景图片)

标题标记<hn>

一般文章都有标题、副标题、章和节等结构,HTML中也提供了相应的标题标记<hn>,其中n为标题等级。

HTML提供了六个等级的标题,n越小,标题的字号越大。

<hn>可以有对齐属性:align=#

#表示:left标题居左;center标题居中;right标题居右

段落标记和换行标记<p>和<br>

在文章的排版过程中,段落与段落之间是有间隔的,HTML中提供了<p>标记来实现;

<p>与<hn>标记一样,可以有align属性

<br>标记可以创建一个回车换行

预排版标记<pre>

<pre>标记允许保留你在原代码中输入的空格和回车,使用方法如下:

<body>
		<p>
<pre>
 编号      名称         价格(元)
001     语文教材        20.00
</pre>
</p>
</body>


字体标记<font>

face设置字体的字形 size设置字体的大小,其值可以是绝对或相对,HTML有七种字号,1号最小,七号最大,缺省字号为三;相对值可以表示为+2、+3等

color可以设置字体颜色,可以用red、blue、green等值,也可以采用六位十六进制,分别指定红、绿、蓝的值。

字体风格

字体风格可以分为物理风格和逻辑风格;

指定物理风格的常用标记有:

<b>黑体、<i>斜体、<u>下划线、<s>删除线

指定逻辑风格的常用标记有:

<strong>强调 <small>较小、<big>较大、<sup>上标、<sub>下标

<html>
<head>
<title>设置字体风格</title>
</head>
<body>
<p align="center">< b>黑体</b></p>
<p align="center"><i>斜体</i></p>
<p align="center"><u>下划线</u></p>
<p align="center"><tt>打字机风格</tt></p>
<p align="center"><em>强调</em></p>
<p align="center"><strong>加重</strong></p>
</body>
</html>
图像标记<img>

用法<img src="图片的路径一般用相对路径" width="图片宽度" height='图片高度' alt=“描述该图片的文字”>

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值