JAVA学习--HTML知识总结(不断更新)

什么是HTML?

HTML称超文本标记语言,是 HyperText Markup Language的缩写。 它包括一系列标签。通过这些标签可以将网络上的文档格式统一,使分散的Internet资源连接为一个逻辑整体。HTML文本是由HTML命令组成的描述性文本,HTML命令可以说明文字,图形,声音,表格,连接等。

一、HTML的基本标签

1.<html>和</html>

 <html>标记用于html文件的最前面,用来表示html文件的开始。
 而</html>的标记则是放在html的最后面,
 用来表示html文件的结束,两个标记必须同时使用。

2.<head>和</head>
 
<head>和</head>构成html文件的头部部分,
在此标记对之间可以使用<title> </title>和<script> </script>等等标记对,
这些标记都是描述html文档相关信息的标记对,
<head> </head>标记对之间的内容是不会在浏览器中的内容部分出现的
。两个标记必须同时使用。

 3.<body>和</body> 

<body>和</body>是html文档的主体部分,
在此标记可以包括“<p>”,“</p>”,“<h1>”,“ ”等等众多的标记,
他们所定义的文本,图片等等将会在浏览器的内容部分显示出来。
两个标记必须一起使用。

二、Meta标记

META标记是html语言的head部分的一个辅助性的标记的,他位于head和title标记之间,他提供给用户不可见的信息。

meta标记的用来为搜索引擎robots定义页面主题,或者是定义用户浏览器上的cookie;可以用于来鉴别作者,设置页面格式,标注内容提要和一些关键字,还可以设置页面的自动刷新以及等级等等。

解释:什么utf-8?

UTF-8(8位元,Universal Character Set/Unicode Transformation Format)是针对Unicode的一种可变长度字符编码。它可以用来表示Unicode标准中的任何字符,而且其编码中的第一个字节仍与ASCII相容,使得原来处理ASCII字符的软件无须或只进行少部份修改后,便可继续使用。因此,它逐渐成为电子邮件、网页及其他存储或传送文字的应用中,优先采用的编码。

三、Title标记

在头部的中,有另一组标签

打在这里面的文字会出现在浏览器视窗最上面蓝色部分里,作为网页的主题。

实例:

<title>这是我的html页面</title>

四、文字分隔标记

强制断行标记 <br断行>
强制分段标记 <p分段>
空格 &nbsp

五、字体标记

1.标题标记

使用方法:<h1标题一>内容</h1标题一>

2.设置字体标记

使用方法:<font size=“2” color=“red” face="黑体"示例>内容

3.字体变化标记

使用:在文字标记中,对于文字的格式也有相当多的变化,如加粗,斜体等等。

 <b> 加粗 </b>     <i>斜体 </i>     <u>底线</u>  

<sup></sup> 上标    <smap>用于字母序列等宽</smap>   

<sub></sub>  下标

<em></em>  强调	<address>模拟信封上的字体</address>   

<strong></strong>  加强

<s></s>删除线   <strike>删除线</strike>

<big>比默认字号大一号</big>    <big>   </big> 比默认字体大一号

<small>比默认字号小一号</small>     <small>   </small>  比默认字体小一号

六、背景标记

使用方法:

示例一:

  <html>

  <head><title>背景颜色</title> </head>

  <body  bgcolor="red">

  <font  size="4"  face="黑体"  color="red">背景颜色</font>

  </body> 
  </html>

示例二:

<html>

  <head><title>背景颜色</title> </head>

  <body  background="bg.jpg">

  <font  size="4"  face="黑体"  color="red">背景图片</font>

  </body> 
  </html>

七、分隔线标记

<hr>  分割线标记

示例:


八、序列标记

1.无序列表的示例:

    <ul>
    无序列表
    </ul>
    

    2.有序列表的示例:

      <ol>
      有序列表
      </ol>
      

      3.自定义列表的示例:

      <dl>
          自定义列表
      </dl>
      

      九、表格

      1.

       <table>是用来在html页面上创建表格的。</table>
      

      2.代表列名一般放在第一行
      3.代表格的一行。
      4.用来定义表格的一列。
      在默认情况下,表格是没有边框的,如果想要出现边框,就是用border属性。

      单元格的合并:

      1.首先确保表格是一个规整的表格(先画完整表格再合并)
      2.根据要合并的单元格,找到其所在的源码位置
      行合并:在要合并的单元格中的第一个单元格上使用属性rowspan=“要合并的单元格的个数”,并删除其他要合并的单元格完成合并
      列合并:在要合并的单元格中的任意一个上使用属性colspan=“要合并的单元格的个数”,并删除要合并的其他单元格

      合并单元格的思想:将多个内容合并的时候就会有多余的东西出来,将其删除。如:将3个td合并成一个,那就多余了2个td,则将多余的两个td删除。
      公式:删除的个数=合并的个数-1

      <!DOCTYPE html>
      <html lang="en">
      <head>
      	<meta charset="UTF-8">
      	<title>Document</title>
      </head>
      <body>
      	<table height="300" width="300" border="1" >
      		
      		<tr>
      			<td>姓名</td>
      			<td>性别</td>
      			<td>年龄</td>
      			
      		</tr>
      		<tr>
      			<td>张三</td>
      			<td>女</td>
      	        <td >18</td>
      		</tr>
      		<tr>
      			<td>李四</td>
      			<td>男</td>
      			<td >18</td>
      		  
      		</tr>
      		<tr>
      			<td>王五</td>
      			<td>男</td>
      		    <td>20</td>
      		</tr>
      	</table>
      </body>
      </html>
      

      十、Input标签

      写法:<input type = “text" value=" "/>

      标签的 type类型分为:
      text -文本框
      button -按钮
      submit-提交
      reset-重置
      password -密码
      checkbox-多选
      radio-单选
      file -上传文件
      date - 选取日、月、年
      month - 选取月、年
      week - 选取周和年
      time - 选取时间(小时和分钟)
      datetime - 选取时间、日、月、年(UTC 时间)
      datetime-local - 选取时间、日、月、年(本地时间)

      例子:

      1.邮箱输入框
      <input type="email" name="user_email" />
      2.数字输入框
      <input type="number" name="points" min="1" max="10" />
      3.数字范围输入框(进度条)
      <input type="range" name="points" min="1" max="10" />
      4.颜色选择框
      <input  type="color" name="colortext"/><br>
      

      十一、层标签

      <div>这个是层标签</div>
      
      • div标签
      • div本身是没有任何的意义
      • 作用:将网页进行模块化的划分
      • 可以用CSS装饰层标签
      • 0
        点赞
      • 1
        收藏
        觉得还不错? 一键收藏
      • 0
        评论
      评论
      添加红包

      请填写红包祝福语或标题

      红包个数最小为10个

      红包金额最低5元

      当前余额3.43前往充值 >
      需支付:10.00
      成就一亿技术人!
      领取后你会自动成为博主和红包主的粉丝 规则
      hope_wisdom
      发出的红包
      实付
      使用余额支付
      点击重新获取
      扫码支付
      钱包余额 0

      抵扣说明:

      1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
      2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

      余额充值