[19/05/13-星期一] HTML_head标签和 body标签

一、概念

概念：超文本标记语言

作用：需要将Java在后台根据用户的请求处理结果在浏览器显示给用户。数据已经过来了，但是显示可能比较凌乱，所以html应用而生，就像写作文要加标点看着舒服。

在浏览器中将数据需要使用友好的格式展示给用户，因为Java代码只能返回单纯的结果。总之一句话，告诉浏览器接收到的数据使用什么样的数据组织形式进行展示，即哪个

地方需要加黑，哪个地方需要换行等需求，告诉浏览器如何组织数据的给用户的看的。（相当于把一个屋子中的东西整理好，看着很舒服）

使用：Sysout.out.println("学生\t老师\t"); Java虚拟机真正显示的是数据" 学生老师" \t就是控制格式的

Sysout.out.println("学生<br>老师<br>"); 同理这里的<br>也是控制格式换行的的。

二、文档标准文档规范

互联网的三大基石：URL：统一资源定位符（唯一的定位一个网络资源）；

HTTP：超文本传输协议规（规范浏览器和服务器之间数据交互的格式）；

HTML：超文本标记语言（有效组织数据在浏览器端的显示）；

HTML的文档声明：文件名.html 或者文件名.htm，自己独特的后缀

HTML的标准文档结构：

顶层标签html

头标签 head 主要配置浏览器的显示信息如编码

主体标签 body (与头标签是平等的关系) 写数据，给用户看的

    <html>

        <head>

            <title></title>

        </head>

        <body>

            hello,world!

        </body>

    </html>

1、HTML的head标签

<!--

    1、快捷键H8 或直接html基本机构全生成。或者先打html在按住tab自动生成一对HTML标签(无法校检字母的对错)

       注释单行 Ctrl+?  多行注释:ctrl+shift+?

       Ctrl+enter 换行

    2、顶层标签html

                头标签 head 主要配置浏览器的显示信息 如编码

                     主题标签title 给文档起个名字，网页标题，告诉浏览器使用什么标题显示当前网页

                主体标签 body (与头标签是平等的关系) 写数据，给用户看的

-->

<html>

    <head>

        <!--<meta charset="UTF-8"/> --> <!-- 这是h5的标签，告诉浏览器使用U"TF-8"编码去解析这个网页-->

        <!--h4的标签，meta是元信息的意思 用http打开，用UTF-8打开。content-type是键表示内容类型，对应下边的

            "text/html; charset=UTF-8"

        -->

        <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>

        <title>HTML学习</title> <!--网页标题-->

        <!--以下标签了解：作用网页在浏览器中搜索概率，即搜索引擎优化。百度竞价排名 V1 V2等相关的等级

            关键字 ：keywords  关键字：HTML,SXT,老李

            网页描述： description 内容："本网页是关于HTML的head标签学习,特别好！

            作者：author 姓名：老李

            自动跳转刷新 refresh：5秒后自动刷新到指定网页 如百度，比如加广告

            后期加入css和js的引入标签

        -->

        <meta name="keywords" content="HTML,SXT,老李"/>

        <meta name="description" content="本网页是关于HTML的head标签学习,特别好！"/>

        <meta name="author" content="老李"/>

        <!--<meta http-equiv="refresh" content="5,url=http://www.baidu.com"/>-->

    </head>

    <body>

        <!--标题标签 ,加粗加黑显示, h1(最大)-h6(最小),自带换行功能，区别于一般文字h7,h7是原样输出

            h1-h6:他们是块级标签，自己占一行.

            标签属性: 这些属性大部分可以被css替代.

            align:排整齐,排版.居中(center)？靠左(left)靠右(right)？

        -->

        <h1>2018年平均工资出炉，这三大行业月平均工资超万元</h1>

        <h1 align="center">2018年平均工资出炉，这三大行业月平均工资超万元</h1>

        <h2>2018年平均工资出炉，这三大行业月平均工资超万元</h2>

        <h3>2018年平均工资出炉，这三大行业月平均工资超万元</h3>

        <h4>2018年平均工资出炉，这三大行业月平均工资超万元</h4>

        <h5>2018年平均工资出炉，这三大行业月平均工资超万元</h5>

        <h6>2018年平均工资出炉，这三大行业月平均工资超万元</h6>

        <!--加个水平横线，好人标签,块级元素,

            width: 宽度，就是水平长度,可以自定义水平线宽度.60%表示占网页的比例是60%,600px表示占屏幕的大小为600像素

            size:表示水平线的高度 ;color:表示设置水平线的颜色

            align:水平线的位置，默认居中

        -->

        <hr width="60%" size="20px" color="red" align="left"/> 

         <h7>2018年平均工资出炉，这三大行业月平均工资超万元</h7>

         <!--p表示段落标签，是个整体.段与段之间会换行，但是段落之间在源码中换行,在网页中不会换行，

         需要自己设置，段落之间可以有图片等，主要是进行css和js操作时比较方便。块级元素

         至于段落里边的可以用br进行换行.行之间和段之间间距很明显差异

         &nbsp;(空格符,速记：牛逼视频),用于一段话前边空格美观.一个nbsp可以空出一个字节的位置,告诉浏览器

         在此位置增加空格符

         可以嵌套使用,没有前后顺序

         b：表示对某些重要的文字加黑显示

         i：表示对某些文字斜体显示

         u:表示加下划线

         del:表示加中划线

         -->

         <p>

             &nbsp;&nbsp;&nbsp; <i>5月14日</i>,2018年平均工资数据出炉，城镇非私营单位就业人员年 <br />

         平均工资为<b> 82461 </b> 元，<u>城镇私营单位为49575元</u>。在非私营单位中，信息传输、<br />

         软件和信息技术服务业、<del>金融业、科学研究和技术服务业的月平均工资超万元.</del>  <br />

         </p>

          <p>

              <i><b><u> 在城镇非私营单位中，信息传输、软件和信息技术服务业达到147678元</u></b></i>

              ，首次突破14万元，

              占据各行业平均工资水平的首位。记者注意到，这是在2016年首次超过金融业后，IT业平均

              工资水平连续第3年继续力压金融业。

          </p>

    </body>

</html>

巴特西

[19/05/13-星期一] HTML_head标签和 body标签_文本标签

最新文章

热门文章

巴特西

[19/05/13-星期一] HTML_head标签 和 body标签_文本标签

最新文章

热门文章

[19/05/13-星期一] HTML_head标签和 body标签_文本标签