[19/06/03-星期一] HTML基础_C/S与B/S的区别&标题标签(h1-h6)、段落标签(p)

时间 2019-11-16

标签星期一 html 基础区别标题标签 h1 h6 段落栏目 HTML 繁體版

原文原文链接

1、C/S与B/S的区别css

C/S（Client/Server）:客户端/服务器html

　　1）通常使用的软件都是C/S架构，好比QQ、360、office365；前端

　　2）C表示客户端，用户经过客户端来使用软件；S表示服务器，服务器负责处理软件的业务逻辑，全部数据发给服务器来处理；node

　　3）必须的安装才能使用；软件更新时服务器和客户端必须得同步更新；C/S架构的软件不能跨平台(跨系统)使用，即windows版的QQ不能在手机上的安卓系统使用ios

　　4）C/S架构的软件客户端和服务器的通讯采用自有协议，相对来讲比较安全。即信息要加密，协议就至关于密码本。即便别人截获信息，不知道协议就破解不出来。windows

　　5）开发成本比较高浏览器

B/S（(Browser/Server）:浏览器/服务器安全

·　 1）本质也是C/S，只不过B/S架构的软件，使用浏览器来做为软件的客户端服务器

　　2）经过使用浏览器访问网页的形式，来使用软件。如京东、淘宝、1230六、新浪微博架构

　　3）软件能够不须要安装，直接使用浏览器访问指定的网址便可，

　　4）软件更新时客户端不须要更新。软件能够跨平台，不论是安卓系统抑或Windows系统、Linux系统只要知道网址均可以访问。一个网址打天下

　　5）采用通用的http协议发消息，至关于密码本你们都知道，相对不安全，可是程序能够本身加密或使用https(底层加密过的协议)协议来通讯。

举例来讲，通俗讲前段负责B：浏览器这个部分， JavaEE主要负责S：服务器这部分，安卓/ios/电脑端的exe软件等开发主要负责C：客户端这部分

软件开发流程：

一、网页设计师根据需求设计网页，如使用PS设计jpg文件。

二、前段工程师将设计作出静态网页，如使用Hbuilder编写HTML文件。承上启下

三、后台工程师将静态网页修改成动态网页，编写服务器代码如使用Java开发的JSP。可使用接口模式，分开整，定义好接口，传数据便可。

什么都会干叫全栈工程师，既能写前端也能写服务器。新的模式：Node.js是一个让JavaScript运行在服务器端的开发平台，之前JavaScript是在浏览器端

前端入门简单，相对于Java而说，Java入门门槛高，可是前端深刻的很难。

2、前端入门

　　结构：HTML用于描述页面的结构，如同人的骨架

　　表现：CSS用于控制页面中元素的样式，如同人的皮肤，画皮，衣服，美化页面

　　行为：JavaScript用于响应用户的操做，但愿一我的能够与别人交流，页面中能够用户交流，响应用户的操做。

3、HTML简介　

　　在纯文本编辑器中编写的内容都是纯文本，如记事本写的txt文件，nodepad++，网页就是纯文本编写。文本只能保存文本内容，图片、音频、视频都不能加上去。

　　HTML(Hyper Text Markup language，超文本标记语言) ，超越单纯的文本，让网页更丰富，它负责网页中三要素之一的结构，HTML使用标签来

标记网页中的不一样组织部分所谓超文本指的是超连接，使用超连接能够帮助咱们从一个页面跳到另外一个页面。

发展历史：（W3C 万维网联盟，XHTML 可扩展超文本标记语言）

　　1993年6月：HTML第一个版本发布；

　　1995年11月：HTML 2.0版本；

　　1997年1月：HTML 3.2版本(W3C推荐)；

　　1999年12月：HTML 4.01版本(W3C推荐)；

　　2000年末：XHTML 1.0版本(W3C推荐)；

　　2014年10月：HTML5版本(W3C推荐)

　　XHTML版本的由来，先有浏览器厂商的实现，后有标准，W3C标准滞后，HTML不够严谨，松散惯了，可是XML(可扩展标记语言)相对严谨，因此XHTML做为从HTML

到XML的过渡版本，XHTML应运而生，可是理想很丰满，现实很骨感。通过4年，2004年浏览器厂商不肯意用XHTML标准，自由惯了，因此三大浏览器厂商(欧朋，火狐，

苹果)本身组织一个WHATWG（超文本应用技术工做组），本身制定了HTML5的标准，可是初期W3C不重视这股力量，依旧推广XHTML，一直到2007年谷歌浏览器加入到

WHATWG联盟,H5的标准进一步推广了，因而2007年两大组织合做，共同制定H5标准，开始推广H5标准，通过将近8年的努力，2014年W3C发布了H5标准。可是因为理念

的不一样，W3C倾向于标准不变，要增长标准能够升级版本，如5.5版本、6.0版本，可是WHATWG倾向于一直使用H5这个名字，不断的修修补补。因此网上关于H5的新增

标签有W3C版本的标准和WHATWG标准2个版本，都能用。网上3个普遍使用的版本，H4.0一、XHTML、H5，为了帮助浏览器知道和识别编写的网页使用版本，能够加上

doctype声明，让浏览器知道是什么HTML版本，<!DOCTYPE html>是H5的文档声明，声明当前网页是使用H5的标准的去写的，相反H4.0一、XHTML的声明特别麻烦，很长。

　　不写文档声明，会致使某些浏览器进入怪异模式，怪异模式中浏览器解析页面会致使页面没法正常显示，因此为了避免进入怪异模式，必需要进行文档声明。

引伸 编码-解码：

　　乱码：计算机很笨，只能识别二进制的0,1，在计算机中保存中任何内容，必须转成二进制来执行，包括各类网页。在读取内容时，须要将二进制转成正确的内容。

若是不能采用正确的字符集去读取就会产生乱码，就是鸡同鸭讲。

编码：依据必定的规则，将字符转换为二进制编码的过程。

解码：依据必定的规则，将二进制编码转换成字符的过程。

　　这个规则就是字符集，就是密码本，若是不使用正确的密码本，解出来一定是乱码。

　　常见的字符集：ASCII(美国，7位二进制表示，128个字符)、ISO-8859-1(欧洲在美国基础，8位二进制表示，256个字符)、GBK(国标码，中国在美国基础的扩充编码)、

GB2312(国标码，中文系统的默认编码)、UTF-8(支持世界上全部国家的各类文字编码方式)。

　　在中文系统的浏览器中，默认都是使用GB2312去解码。记事本中ANSI是系统的默认编码，在中文系统中采用GB2312编码，在英语系统中可能就是ASCII编码，很灵活。

3.1 标题标签（h1-h6）　

　　在显示效果上h1最大，h6最小，可是对文字的大小并不关心。由于经过css能够设置文字的大小

　　使用HTML标签时，关心的是标签的语义(好比h1能够是文章的一级标题，h2能够是文章的二级标题)，咱们使用的标签都是语义化标签。关心的语义，而不是显示效果。

　　h1最重要，表示一个网页中的主要内容，h2-h6重要性依次递减。h1的重要性仅次于title，对于搜索引擎，它搜索完title标题后，当即查看一级标题。

　 h1很重要，会影响网页在搜索引擎中的排名，页面只能或通常只写一个h1，若是都是一级标题，意味着它都不重要，还可能被搜索引擎判为垃圾网站，更加影响排名。

　　通常页面标题标签只使用h一、h二、h3，h4-h6基本都不会使用。

3.2 段落标签（p）

　　段落标签用于表示内容中的一个天然段，使用标签p来表示一个段落。p标签中的文字会默认独占一行，而且段与段之间会有一个间距。

　　在编写HTML源码时，字符之间无论写再多的空格，浏览器也会当成【一个】空格解析，换行也会当成【一个】空格解析。

引伸：换行标签（br）: 使用<br />来表示一个换行，它是个自结束标签。

　　　水平线标签（hr）: 使用<hr />在当前页面生成一个水平线，它也是一个自结束标签。

<!DOCTYPE html>
<!--html根标签：一个网页有且只有一个根标签，网页中的全部内容都应该写在html根标签中-->
<html> 
    <!--head标签：该标签的内容不会再网页中直接显示，它能够帮助浏览器解析页面-->
    <head>
        <!--meta标签是设置网页的元数据，好比网页的字符集、关键字、简介
            meta是个自结束标签，编写一个自结束标签，能够在开始标签中添加一个"/",有的不加貌似也能够
        -->
        <meta charset="UTF-8"> <!--告诉浏览器采用UTF-8字符集去解码-->
        
        <!--title网页的标题标签：默认显示在浏览器的标题栏中
            搜索引擎在检索页面时，会首先检索title中的内容，它是网页中对于搜索引擎最重要的内容，会影响网页在搜索引擎
            中排名，会有SEO(搜索引擎优化)主要干这个事
        -->
        <title>html基础知识再学习</title>
        
    </head>
    
    <!--body标签用来设置网页的主体内容，网页中全部可见的内容，都应该在body中书写-->
    <body>
        <!--属性：<font> 样式的意思， 规定文本的字体 face、字体尺寸 size(1-7之间)、字体颜色 color
            font标签不同意使用，可使用css来设置
            能够经过属性来设置标签去如何处理标签中的内容，能够在开始标签中添加属性；
            属性须要写在开始标签中，实际上就是一个名-值对的结构。
            一个标签中能够设置多个属性
            
            
        标签和元素是一个意思
        如：<h1>文字</h1> 这里h1既能够叫标签也能够叫元素
        -->
        <font color="blue" size="4" face="微软雅黑">你敲代码好像蔡徐坤呀</font>
        
        <!--3.一、标题标签：h1-h6    -->    
        <h1>锦瑟</h1>
        
        <!--3.二、段落标签：p 
            引伸：换行标签：br  <br />是个自结束标签
                         hr  <hr />也是一个自结束标签
        -->
        <p>锦瑟无故五十弦，一弦一柱思华年。</p>
        <p>庄生晓梦迷蝴蝶，望帝春心托杜鹃。</p>
        <p>沧海月明珠有泪，蓝田日暖玉生烟。</p>
        <p>此情可待成追忆？只是当时已惘然。</p>    
        
        <p> <h4>解析：</h4>
            瑟本有二十五根弦，但此诗创做于李商隐妻子死后，故五十弦有断弦之意<br />
            但即便这样它的每一弦、每一音节，足以表达对那美好年华的思念。<br />
            庄周其实知道本身只是向往那自由自在的蝴蝶。<br />
            望帝那美好的心灵和做为能够感动杜鹃。<br />
            大海里明月的影子像是眼泪化成的珍珠。<br />
            只有在彼时彼地的蓝田才能生成犹如生烟似的良玉。<br />
            那些美好的事和年代，只能留在回忆之中了。<br />
            而在当时那些人看来那些事都只是日常罢了，却并不知珍惜。<br />
        </p>

        
        
    </body>
</html>