Java Web_01从入门到精通

最新推荐文章于 2021-09-22 14:23:49 发布

林钟二五

最新推荐文章于 2021-09-22 14:23:49 发布

阅读量237

点赞数

分类专栏： JavaWeb

本文链接：https://blog.csdn.net/weixin_44561640/article/details/96762156

版权

JavaWeb 专栏收录该内容

17 篇文章 0 订阅

订阅专栏

本文详细介绍了HTML的基础语法，包括标记语法、属性语法、HTML文件的命名规范及编写注意事项。讲解了单标记、双标记的使用，属性的设置方法，以及HTML文件的基本结构，如设置页面标题、边距、文本颜色等。此外，还探讨了段落内容的控制，如回车、分段、预格式化、水平线插入和特殊符号的使用。

摘要由CSDN通过智能技术生成

                                超文本标记语言HTML

HTML基本语法
一、标记语法
1.什么是标记语法
HTML是用于描述功能的符号称为"标记"。比如、、等，都是标记，标记表示HTML文档的开始。
2.单标记
标记语法是：<标记名称/>
最常用的单标记
,它表示换行。
3.双标记
"双标记"由"始标记"和"尾标记"两部分构成，必须成对使用。
始标记告诉WEB浏览器从此处开始执行该标记所表示的功能，尾标记告诉WEB浏览器在这里结束该功能。始标记前加一个正斜杠（/）即为尾标记。
<标记>内容</标记>
其中"内容"部分就是要这对标记施加作用的部分。

二、属性语法
1.什么是属性
这里的属性指的是标记的属性
2.属性语法
<标记名字属性1 属性2 属性3 …>

三、HTML文件的命名
应注意以下几点：
1.文件的扩展名要以.htm或.html结束
2.文件名中只可由英文字母、数字或下划线组成
3.文件名中不要包含特殊字符，比如空格、$
4.网站首页文件名默认是index.htm或index.html

四、编写HTML文件的注意事项
1.所有标记都要有尖括号括起来，这样，浏览器就可以知道尖括号内的标记语言是HTML命令
2.对于成对出来的标记，最好同时输入起始标记或结束标记，以免忘记
3.采用标记嵌套的方式可以为同一个信息应用多个标记，如下
同一信息
4.在代码中，不区分大小写
5.任何空格或回车在代码中都无效
6.标记中不要有空格，否则浏览器可能无法识别
HTML文件的基本结构
一、文件头部内容
一个完整的HTML文件包括头部文件和主体文件，头部标记是成对的，主体标记是成对的
1、设置页面标题<br/> HTML文件标题在浏览器的标题栏中显示。每个HTML文件都有一个标题，用于说明文档的属性。在HTML文件中，页面标题标记<title>位于头部标记之间
基本语法

<html>
<head>
<title>请在此输入标题名</title>
</head>
<body>
</body>
</html>

1、设置页面标题

<title>标题内容</title>  设置网页的标题
<body>网页内容</body>  body里面的内容是网页的主体，主要在这里面进行编写代码

在这里插入图片描述
2、设置基底网址
基底网址用于设定浏览器中文件的路径，标识一般用于设置文件的URL地址。一个HTML文件只能有一个标识，同时该标记必须放于头部文件中。
基本语法

<head>
  <base href="文件路径" target="目标窗口">
</head>

语法说明
href用于设置网页文件链接的地址即进行跳转，target用于设置页面显示的目标窗口
如：

<body>
 2009年10月16日，<A href="index">东北大学秦皇岛分校</A>
</body>

点击“东北大学秦皇岛分校”则会跳转到下一个页面
3、定义元信息
在HTML文件中，标记通过一些属性来定义文件的信息，比如文件的关键字、作者信息、网页过期时间等。HTML文件的头部文件可以有多个标记，不是成对标记
基本语法

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

语法说明

标记中的http-equiv属性用于设置一个http的头域，取值由content属性决定，name属性用于设置元信息出现标识，conent属性用于设置元信息出现的内容 4、设置页面关键字-keywords 基本语法 ``` ``` 语法说明 keywords用于说明定义的是关键字，value 用于说明为该页定义的关键字，可以是多个关键字。类似与淘宝上的关键词搜素如：`` 二、主体内容在HTML文件中，主体内容被包含在成对的标记之间，同时标记也有很多本身的属性，例如设置页面背景、设置页面边距等。 1.设置页面背景bgcolor 基本语法`

<body bgcolor=" ">

语法说明
利用标记中的bgcolor属性，可以设置网页的背景颜色
如：

<body bgcolor="blue">
</body>   将网页的背景设置为蓝色

在这里插入图片描述
2.设置网页边距-topmargin、leftmargin、rightmargin、bottommargin
在HTML文件中，可以设置页面边距，通过设置页面边距属性的属性值来设置页面显示内容与浏览器的距离，使显示的内容更加美观。

<body topmargin=value leftmargin=value rightmargin=value bottommargin=value>

语法说明
设置到顶端的距离
设置到左边的距离
设置到右边的距离
设置到底边的距离
如：<body topmargin=0 leftmargin=20 rightmargin=20 bottommargin=180>
3.设计正文颜色text
在HTML文件中，设置页面的背景颜色以后，网页中可能有部分文字的颜色需要改变才能显示，利用text属性可以给页面中无链接的文字设置颜色
基本语法

<body text="">
</body>

语法说明
在标记中，利用text属性设置文档的颜色时，还可以进行其他的设置，例如：背景、字体等。
如：<body text="white" bgcolor="red">将文本内容设置为白色，背景颜色为红色
在这里插入图片描述
段落内容
1.回车

2.分段控制标签

基本语法
设置文字左对齐、剧中、右对齐

段落文字

, 可以省略参数值：right，left(默认)，center 3.居中显示文字基本语法：文字内容 4.预格式

   设置文字为默认大小和字体
基本语法：文字内容
5.插入并设置水平线
  
  
基本语法：

<hr align="参数值" size="参数值"  width="参数值"  color="参数值" noshade>

align:水平摆放位置，可选right,left,center（默认）
Size:水平线的粗细，以像素为单位
Width:水平线的长度，以像素或百分比为单位
Color:水平线的颜色
noshade：设定水平线是否显示3D阴影
如：

<center>添加水平线后的效果</center>
      <hr width="100%" size="5" color="000000">

在这里插入图片描述
即长度为100% 粗细度为5 颜色为000000对应的极端色黑色，FFFFFF是白色
6.插入特殊符号
基本语法

& & © © ™ ™ ® ® ¥ ¥ § § ; 如：代码中为： `欢迎来到延安大学™` 网页实现的内容为: 欢迎来到延安大学™ 代码所随文字的位置不同，特殊符号出现的位置就会改变 ![在这里插入图片描述](https://img-blog.csdnimg.cn/2019072120171770.png) 一、编辑内容 1.添加文字基本语法

<body>
请在此处添加文字
</body>

语法说明
在网页中添加文字，只要在之间，需要插入文字的地方输入文字就可以实现。
2 添加注释<! ---->
在HTML文件中，为了增加代码的可读性，需要对代码添加必要的注释。这些注释语句可方便编写者的检查与维护，同时这些注释信息也不会在网页中被显示。
3 .添加空格
在HTML文件中，添加空格的方式与其他文档添加空格的方式不同，网页中添加空格是通过代码控制，在Word、记事本、写字板中输入空格可以直接通过键盘空格键输入。
基本语法

<body>
&nbsp;&nbsp;&nbsp;
</body>

语法说明
在HTML文件中，添加空格需要使用代码" “控制，需要多少个空格就需要添加多少个” "。
如：    延安大学
网页呈现的内容为：
在这里插入图片描述
4 . 添加删除线
在HTML文件中，给需要添加删除线的文字使用成对的标记，就可以添加删除线
基本语法

<body>
<strike>请在此输入需要添加删除线的文字</strike>
</body>

语法说明
在成对的标记之间输入文字，在网页中显示改标记之间的文字就是被添加了删除线后的显示效果
如：<strike>添加了删除线的文字</strike>
在这里插入图片描述
二、文字效果
1.标题文字标签
标签一共为6级
基本语法：
标题文字
align属性值为right，left（默认），center
如：

<h1 align="center">标题文字</h1>
		<h2>标题文字</h2>
		<h3>标题文字</h3>
		<h4>标题文字</h4>
		<h5>标题文字</h5>
		<h6>标题文字</h6>

在这里插入图片描述
2. 编辑网页文字样式
基本语法

<body>
<font face=" " size=" " color=" "></font>
<body>

语法说明
在HTML文件中，利用成对标记就可以将网页中的文字根据需要，对其进行样式的编辑。
如：

<font face="楷体" size="6" color="#00ffff">
			使用效果后的文字

在这里插入图片描述
3. 设置文字标注标记
在HTML文件中，有时需要对某个字、词或者某个段进行说明，可以通过添加文字的标注标记来完成对网页中文字的说明。
基本语法：

被说明的文字

文字的标注

语法说明：
利用成对的标记，可以对网页中的文字进行标注。
如：

<ruby>
      		当代最可爱的人
       	 <rt>
     		  志愿军
       	 </rt>
        </ruby>

在这里插入图片描述
三、文字修饰
1.简单修饰文字
基本语法

<body>
普通文字的显示<br>
<b>加粗的文字</b><br>
<i>斜体的文字</i><br>
<u>添加下划线的文字</u><br>
<big>放大</big><br>
<small>缩小</small><br>
</body>

在这里插入图片描述
2. 确定文字上下标
基本语法：

<body>
<sup>上标内容</sup><br>
<sub>下标内容</sub><br>
</body>

语法说明：
在HTML文件中，成对的标记可以表示上标，利用成对的标记表示下标。
如;

 解下面方程：<br>
   x<sup>2</sup>-3x+2=0<br>
   解：x<sub>1</sub>=1; x<sub>2</sub>=2<br>

在这里插入图片描述
3.设置地址文字
在网页中添加地址文字，是为了更方便地突出显示联系方式，将联系人的地址信息突出显示。
基本语法：

<body>
<address>请在此添加地址信息</address>
</body>

语法说明：
在HTML文件中，利用成对

标记就可以将网页需要显示的地址文件突出显示。

如：

书中有不恰当的地方，请您及时与我们联系：<br>
   <address>清华大学出版社</address><br>
   <address>E-mail:market@1.com.cn</address><br>

在这里插入图片描述

林钟二五

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Java Web_01从入门到精通

超文本标记语言HTMLHTML基本语法一、标记语法1.什么是标记语法HTML是用于描述功能的符号称为"标记"。比如、、等，都是标记，标记表示HTML文档的开始。2.单标记标记语法是：<标记名称/>最常用的单标记,它表示换行。3.双标记"双标记"由"始标记"和"尾标记"两部分构成，必须成对使用。始标记告...
复制链接

扫一扫

专栏目录