html1

最新推荐文章于 2022-11-15 14:00:52 发布

最新推荐文章于 2022-11-15 14:00:52 发布 · 912 阅读

·

0

·

本文介绍了HTML的基本概念和使用方法，包括HTML的结构、标签、属性等内容，并详细解释了如何使用各种标签来实现网页的设计。

HTML简介

HTML（Hyper Text Mark-up Language 超文本标记语言）的缩写，是最基础的网页语言。标记：就是用来修饰网页内容的一些特定符号，所以理解和掌握都是十分容易的。可以说，HTML语言在所有的计算机编程语言中是最简单易学的。
Html是通过标签来定义的语言，代码都是由标签所组成。Html代码不用区分大小写。
手工直接编写（任何文本编辑器都可以编写HTML，都可用来制作网页。比如记事本、写字板、Word、WPS等编辑程序。不过在保存时要存为.html或.htm格式）。

通过图形化的HTML开发软件 Dreamweaver。
Html代码由<html>开始</html>结束。里面由头部分<head></head>和体部分<body></body>两部分组成。
头部分是给Html页面增加一些辅助或者属性信息，它里面的内容会最先加载。
体部分是真正存放页面数据的地方。

标签：是由一对尖括号<>和标签名称组成。标签分为“起始标签”和“结束标签”两种，二者的标签名称是相同的，只是结束标签多了一个斜杠“/”。
单标签：是因为它只需单独使用就能完整地表达意思。语法是：<标签名称> 如<br>，它表示换行。
双标签：必须成对使用。语法是： <标记>内容</标记>，其中“内容”部分就是要被这对标记施加作用的部分。
属性
在元素的起始标签中，可以包含“属性”来表示元素的其他特性，想要对被标签修饰的内容进行更丰富的操作，就用到了标签中的属性，通过对属性值的改变，增加了更多的效果选择。
格式：<标签名属性名='属性值'> 数据内容 </标签名>
<标签名属性名='属性值' />
属性与属性值之间用“=”连接，属性值可以用双引号或单引号或者不用引号，一般都会用双引号。或公司规定书写规范。多个属性之间以空格分隔，不区分先后顺序。
<hr size=3 align=left width=”75%”>

HTML 文档示例

HTML文件的命名
注意：
 文件的扩展名要以.html或.html结束。
 文件名中只可由英文字母、数字或下划线组成。
 文件名中不要包含特殊符号，比如空格、$等。
 文件名是区分大小写的，在Unix和Windows主机中有大小写的不同。
 网站首页文件名默认是index.htm或index.html。
编写HTML文件的注意事项
 所有标记都要用尖括号（<>）括起来，这样，浏览器就可以知道，尖括号内的标记是HTML命令。
 对于成对出现的标记，最好同时输入起始标记或结束标记，以免忘记。
 在代码中，不区分大小写，比如，将<head>写成<HEAD>或<Head>都可以。
任何空格或回车在代码中都无效，插入空格或回车有专用的标记，分别是&nbsp、<br>。因此，不同的标记间用回车键换行再编写是个不错的习惯。

操作思想：
为了操作数据，需要对数据进行不同标签的封装，通过标签中的属性对封装的数据进行操作。
标签就相当于一个容器。对容器中的数据进行操作，就是在不断的改变容器的属性值。

head元素包含的是网页的头部信息，它的内容主要被浏览器所用而不会显示在网页正文中。
head元素中可以包含下述一些元素。
title元素：文件标题声明
link元素和style元素常用于CSS
script元素用于脚本
meta元素元信息
<base> 超链接网址基准参考点
设置基底网址<base>
<head>
<base href=”文件路径” target=“目标窗口”>
</head>
base 元素可规定页面中所有链接的基准 URL。
<head>
<base href="http://www. sina.com.cn" target="_self"> </head>
</beae>

定义元信息<meta>
<meta> 元素可提供有关页面的元信息（meta-information），比如针对搜索引擎和更新频度的描述和关键词。

<meta name=”” content=””>
<meta http-equiv=”” content=””>

name 属性：网页的描述信息。当取keywords时，content属性的内容就作为搜索引擎的关键字进行搜索。
http-equiv 属性：模拟HTTP协议的响应消息头。

<head>
<title>设置文件关键字</title>
<meta name=”keywords” content=”计算机、英语、经管、财会、职场”> …
<meta http-equiv=”expires” content =” 31 Dec 2008 ”>

</head>

<META http-equiv="refresh" content=“2">
表示每隔2秒，自动刷新网页。

<META http-equiv="refresh" content=“2;url=http://www.sina.com.cn">
表示打开此页面2秒后自动跳转到新浪

body元素是html文件的主体元素，它包含所有要在网页上显示的各种元素。
设置页面背景:bgcolor
设置背景图片:background
设计正文颜色:text
格式： <body bgcolor= ” 背景色 ” text= ” 文字颜色 ” >

设置页面边距:topmargin、leftmargin、
rightmargin、bottomnargin
设置显示内容与浏览器的距离
<body leftmargin= ” 像素 ” topmargin= ” 像素 ” >

HTML 基本元素
标题
段落
换行符
预先格式化
字符格式化
水平线
字体
图像
特殊字符
超级链接
标题
HTML 注释
添加注释<！-- -->
给代码添加注释语句时，可以放在HTML文件的任何地方，都不会在网页中被显示出来。

<!—这里是HTML课堂-->
网页不显示，清晰解释源代码

添加空格—— 
在HTML文件中，添加空格需要使用代码“&nbsp；”控制，需要多少个空格就需要添加多少个“&nbsp；”。
实体字符控制标记
1.<b> … </b> 粗
2.<i> … </i> 斜
3.<s> … </s> 删
4.<u> … </u> 下划
6.<sub> … </sub> 下标 X<sub>2</sub>
7.<sup> … </sup> 上标 O<sup>2</sup>
5.<tt> … </tt> 电报
6.<code>…</code> 源代码
7.<samp>…</ samp >示例
8.<kdb>…</ kdb >键盘输入
语意字符控制
1.<address> … </address> 地址自动倾斜 <address>河北保定</address>
2.<big> … </big> 大字
3.<del> … </del> 删除
4. <ins>...</ins> 修改
5.<samll> … </small> 小字
6. <strong> … </strong> 加强语气 ( 加粗 )
7. <em>...</em> 加强语气 ( 倾斜 )

默认斜体
cite。引文
dfn。定义
var。程序变量
缩写与缩略
abbr。缩写。
acronym。缩略。不变
内容
del。删除内容。默认删除线
ins。插入内容。默认下划线
q。引用。有效果

<bdo> 元素可覆盖默认的文本方向。

<bdo dir="rtl">
Here is some Hebrew text
</bdo>
属性dir: 值ltr rtl
定义文字的方向

插入特殊符号
网页文字样式<font>
<font face=”” size=”” color=””></font>

段落标签
换行符
只要在文本中放入 <BR> 标签，就会强制换行
<Pre> 标签
段落缩进<blockquote>
设置水平线<hr>
水平线的属性

<HR noshade size = 5 align = center width = 50%>
<HR size = 15 align=left width = 80%>
<HR>

向中对齐 <center> ( 被废弃的标签 )
格式： <center> … </center>

评论

被折叠的条评论为什么被折叠?

到【灌水乐园】发言

查看更多评论

添加红包

成就一亿技术人!

hope_wisdom

发出的红包

实付元

使用余额支付

点击重新获取

扫码支付

钱包余额 0

抵扣说明：

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