初识HTML的基础知识点
初识HTML！！！
一、系统构架
1.B/S构架
（1）B/S构架（Browser / Server) 就是（浏览器/服务器的交互形式）
Browser支持HTML、CSS、JavaScript
（2）优缺点
优点：升级方便，只升级服务器代码饥渴，维护成本低
缺点：速度快，体验不好，界面不够炫酷
企业内部的架构都是B/S架构
（3）B/S架构的系统的代表：京东、百度、天猫······
2.C/S架构
（1）C/S架构（Client/Server) 就是（客户端/用户服务器端的交互形式）
（2）优缺点
优点：速度快，体验好，维护成本低
缺点：升级麻烦，维护成本高
娱乐型的系统多数是C/S架构
（3）常见C/S架构的系统： QQ、微信、支付宝····
二、 HTML
1.什么是HTML？
HTML（超文本标记语言）全称为 Hyper Test Markup Language，由大量的标签组成，每一个标签都有开始标签和结束标签.
超文本：多媒体、图片、视频、声音等等.
2.怎样开发HTML？
HTML开发时，使用普通的文本编辑器就行，创建的文件扩展名是.html或.htm，当然也有专业的开发工具DreamWeaver、HBuider······
3.怎样运行HTML?
采用浏览器打开HTML文件就可以运行.
三、我的第一个HTML页面
1.代码展示：
Demo：
<!--根-->
<html>
<!--头-->
<head>
<title>my_website</title>
</head>
<!--体-->
<body>
欢迎来到我的网站！！！
</body>
</html>
现在只是给大家给大家展示，不用管每个是什么意思，后面会有讲解.
2.注意事项：
（1）在中包含的就是网页名称
（2）有/的标签都是结束标签
（3）在 中就是网页内容
（4）在文件最上方加上<!doctype html>就是html5.0，不加就是4.0
（5）HTML中的注释是<!- - 注释内容 - - >
多行注释：
<! - -
注释内容1
注释内容2
注释内容3
······
- ->
（6）HTML中不区分大小写，语法松散不严格
四、HTML中的基本标签
1.段落标记标签
HTML中，段落标记采用
····
标签，在体中使用此标签
Demo示例：
<!--根-->
<html>
<!--头-->
<head>
<title>my_website</title>
</head>
<!--体-->
<body>
<P>人无完人，每个人都既有强项，又有弱项。不要为自己的弱项进行辩护，或者拒绝承认该弱项。相反，要清楚地认识自己的弱势在哪里，然后为自己设定一个目标，制定相应计划，来不断充实、完善自己，使自己在各个方面都变得十分优秀。</P><p>世上没有不弯的路，人间没有不谢的花，人这一生能力有限，但是努力无限。努力做一个善良的人，做一个心态阳光的人，做一个积极向上的人，用正能量激发自己，也感染身边的朋友，你阳光，世界也会因你而精彩！</p>
</body>
</html>
结果：
2.标题字标签
HTML中采用
到
表示标题字，HTML中的标题字和word中的标题字相同
Demo实例：
<!--根-->
<html>
<!--头-->
<head>
<title>my_website</title>
</head>
<!--体-->
<body>
<h1>一级标题</h1>
<h2>二级标题</h2>
<h3>三级标题</h3>
<h4>四级标题</h4>
<h5>五级标题</h5>
<h6>六级标题</h6>
</body>
</html>
结果：
3.换行标签
HTML中采用
换行
Demo示例：
<!--根-->
<html>
<!--头-->
<head>
<title>my_website</title>
</head>
<!--体-->
<body>
hello <br> world！！！
</body>
</html>
4.水平直线
HTML中使用
表示水平线
Demo示例：
<!--根-->
<html>
<!--头-->
<head>
<title>my_website</title>
</head>
<!--体-->
<body>
hello world!!!
<hr color = "red" width = "50%">
</body>
</html>
其中的color和width都是hr的属性，width表示线的宽度，color表示线的颜色
5.预留格式
HTML中采用
表示预留格式
如想在网页中输出 for(int i=0;i<10;i )
{
printf("%d ",i);
}
如果直接这么写，网页上会直接显示一行，而不是分行的，
标签中是什么格式，在网页中显示就是什么格式Demo示例：
<!--根-->
<html>
<!--头-->
<head>
<title>my_website</title>
</head>
<!--体-->
<body>
<pre>
for(int i=0;i<10;i )
{
printf("%d ",i);
}
</pre>
</body>
</html>
6.删除字、插入字、粗体字、斜体字
在HTML中用标签表示删除字，标签表示插入字，标签表示粗体字，标签表示斜体字
Demo示例：
<!--根-->
<html>
<!--头-->
<head>
<title>my_website</title>
</head>
<!--体-->
<body>
<del>删除字</del>
<ins>插入字</ins>
<b>粗体字</b>
<i>斜体字</i>
</body>
</html>
7.右上角加字和右下角加字
在HTML中用标签表示在右上角加字，使用标签在右下角加字
Demo示例：
<!--根-->
<html>
<!--头-->
<head>
<title>my_website</title>
</head>
<!--体-->
<body>
<!--右上角加字-->
10<sup>2</sup>
<!--右下角加字-->
10<sub>i</sub>
</body>
</html>
8.字体标签
在HTML中采用标签来表示字体标签
Demo示例：
<!--根-->
<html>
<!--头-->
<head>
<title>my_website</title>
</head>
<!--体-->
<body>
<font color = "blue" size = "40">字体标签</font>
</body>
</html>
这里的color和size就是font标签的属性，red和40就是属性值
五、HTML中的基本符号
这里咱们仅介绍常用的符号，在HTML中采用<；来表示小于符号，>；表示大于符号， ；来表示空格
Demo示例：
<!--根-->
<html>
<!--头-->
<head>
<title>my_website</title>
</head>
<!--体-->
<body>
<!--a<b-->
b<a <br>
<!--b>c-->
b>c <br>
<!--he llo,给大家展示空格-->
he llo
</body>
</html>
这篇好文章是转载于：学新通技术网
- 版权申明： 本站部分内容来自互联网，仅供学习及演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系，请提供相关证据及您的身份证明，我们将在收到邮件后48小时内删除。
- 本站站名： 学新通技术网
- 本文地址： /boutique/detail/tanhgfabkc
-
photoshop保存的图片太大微信发不了怎么办
PHP中文网 06-15 -
Android 11 保存文件到外部存储，并分享文件
Luke 10-12 -
word里面弄一个表格后上面的标题会跑到下面怎么办
PHP中文网 06-20 -
《学习通》视频自动暂停处理方法
HelloWorld317 07-05 -
photoshop扩展功能面板显示灰色怎么办
PHP中文网 06-14 -
微信公众号没有声音提示怎么办
PHP中文网 03-31 -
excel下划线不显示怎么办
PHP中文网 06-23 -
excel打印预览压线压字怎么办
PHP中文网 06-22 -
怎样阻止微信小程序自动打开
PHP中文网 06-13 -
TikTok加速器哪个好免费的TK加速器推荐
TK小达人 10-01
