HTML基础——网站信息显示页面

news/2024/5/13 8:39:50/文章来源:https://blog.csdn.net/anjiukonghe77852/article/details/102312193

1、语法和规范

HTML文件都是以.html或者.htm结尾的。建议使用.html结尾。
HTML文件分为头部分(<head></head>)和体部分(<body></body>)
HTML标签都是由开始标签和结束标签组成。(<hr />)
HTML标签不区分大小写，建议使用小写。

2、HTML相关标签学习

　　2.1标题标签

标题标签使用<hn />,n从1到6字体大小逐渐变小，超过6的按6显示
　　　　特点：加粗加黑，单独占用一行，与其他行有一定行间距
　　　　注释： 快捷键Ctrl+/

　　2.2水平线标签

水平线标签 <hr />

　　2.3段落标签

段落标签

　　2.4字体标签

字体标签
　　必须结合其属性才能具备一定的样式效果。

　　　　　　属性：size:指定内容的大小（从1到7逐渐变大，超过7的按照7来显示）
　　　　　　　　 color：指定内容的颜色（可以是英文单词，也可以是十六进制）
　　　　　　　　 face：指定内容的字体（那些字体必须是你本机已经有的）

加粗：
　　斜体：
　　下划线：

　　注意：HBuilder同样支持Alt+/自动输出提示。

3、在HBuilder中新建HTML文件，命名为网站信息显示页面，代码如下：

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="UTF-8">
 5         <title>网站信息显示页面</title>
 6     </head>
 7     <body>
 8         <!--1.创建一个标题标签-->
 9         <h2>皮囊师</h2>
10         
11         <!--2.创建一条水平线标签-->
12         <hr />
13         
14         <!--3.分别创建段落标签-->
15         <p>
16         <font color="red">演皮影戏的师傅</font>正弓着背在一张矮桌子上修补坏了的皮影。他的手边有好多皮影，有红有绿，有男有女，有兔有马，仿佛一个完整的世界。而他，就是那个世界的造物主。      
17         </p>
18         
19         <p>    
20         世人皆知<b>皮囊师</b>，而很少听说<i>操控师</i>，是因为绝大部分人只注重容颜，而不注重行为举止。皮囊师兴盛于皇城，尤其后宫，操控师也兴盛于皇城，但在后宫不如皮囊师受欢迎。只有少数皇帝的嫔妃知道，容颜只能引起皇帝的注意，但那只是一时之兴，而行为举止才能让皇帝处久不厌。于是，宫中出现了一种女官，名为司仪，授九品衔。司仪专门教宫中女人举止仪态，后来又教一些关系亲密的嫔妃如何勾引皇帝，让皇帝恋恋不舍，尽可能多地逗留。
21         </p>
22         
23     </body>
24 </html>