1.Html概述

1.1什么是Html

   Html:超文本标记语言(hyperText Markup Language)

  • “超文本”加上指页面内可以包含图片,链接等非文字内容。

  • “标记”就是使用标签的方法将需要的内容包括起来。例如:<a>http://www.baidu.con</a>

  格式:

<html>
<head>
<title>这是标题</title>
</head>
<body>
这里是正文
</body>
</html>

常用标签:

    标题标签:<h1></h1>   ( <h1>~<h6> h1定义最大的标签,h6最小)

 Html-知识总结 随笔

SRE实战 互联网时代守护先锋,助力企业售后服务体系运筹帷幄!一键直达领取阿里云限量特价优惠。

水平线:<hr/>

字体标签:<font>

粗体:<b>

斜体:<i>

段落:<p>

单行换行:<br/>

图片:<img>

  • src:显示图片的路径
  • alt:图片无法显示时代替的文本
  • width:图片的高度
  • height:图片的高度
  • title:鼠标移上显示的文本

例:<img  src="img/01.jsp" alt="图片无法显示“ width=“20px” heigth="20px"  title="鼠标移上显示的文本"/>

 

列表标签:<ul> <ol>

<ol> 定义有序列表

 ■ type 列表类型,取值: A、a、l、i、1等

<ul> 定义无序列表

■ type符号的类型,取值:disc 实心圆、square 方块、circle空心圆

 

<li> 定义列表项。 是<ul> 或 <ol> 的子标签

例如:

<!--列表标签-->
<ul type="circle"> <!--以"空心圆"显示无序列表-->
<li>无序</li>
<li>无序</li>
<li>无序</li>
</ul>
<ol type="I"> <!--以大写阿拉伯数字显示序号-->
<li>有序</li>
<li>有序</li>
<li>有序</li>
</ol>

 超链接标签 <a>

■ href: 用于确定需要显示页面的路径(URL)

■ target: 确定以何种方式打开href所设置的页面。常用取值: _blank、_self等

◆ _blank 在新窗口中打开href 确定的页面。

◆ _self 默认。使用href 确定的页面替换当前页面。

 

表格标签<table> <tr><td>

■ HTML 表格由<table> 标签以及一个或多个<tr>、<th> 或<td> 标签组成。

◆ <table> 是父标签, 相当于整个表格的容器。

◆ width 表格的宽度。

◆ cellpadding 单元边沿与其内容之间的空白。

◆ cellspacing 单元格之间的空白。

◆ bgcolor 表格的背静颜色。

■ <tr> 标签用于定义行

■ <td> 标签用于定义表格的单元格(一个列)

◆ colspan 单元格可横跨的列数。

◆ rowspan 单元格可横跨的行数。

◆ align 单元格内容的水平对齐方式,取值:left左、right 右、center 居中。

◆ nowrap 单元格中的内容是否折行。

■ <th> 标签用于定义表头。单元格内的内容默认居中、加粗。

 

框架标签:<frameset>

<frame>标签,用于设置<frameset>框架集中的一个页面(框架)。

● src 属性: 确定页面的路径

● noresize 属性: 框架分隔先不能移动

● target属性: 确定需要显示的页面在何处显示。

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>网站后台系统显示页面</title>
</head>
<framset rows="15%,*">
<frame src="top.html" name="top"/>
<framset cols="15%,*">
<frame src="left.html" name="left"/>
<frame src="right.html" name="right"/>
</framset>
</framset>

</html>

表单标签:<form>

action 属性:请求路径,确定表单提交到服务器的地址(路径)   提交的数据追加在请求路径上。

method 属性:请求方式,常用的取值:GET,POST  提交的数据不再请求路径上追加(及不显示在地址栏上)

 输入域标签:<input>

type属性:

text:文本框,单行的输入字段,用户可在其中输入文本。默认宽度为20个字符

password:密码框,密码字段。该字段中的字符以黑圈显示。

radio:单选框,表示一组互斥选项中的一个。当一个按钮被选中,之前选中的按钮就变为非选中的。

submit:提交按钮。提交按钮会把表单数据发送到服务器。一般不写name属性,否则将“提交”两个提交到服务器。

checkbox:复选框

file:文件上传组件,提供“浏览”按下可以选择需要上传文件。

hidden:隐藏字段,数据会发送给服务器,但浏览器不进行显示。

reset:重置按钮。将表单恢复到默认值。

image:图形提交按钮,通过src给按钮设置图片。

button:普通按钮,常用于与JavaScript结合使用。

name:元素名,如果需要表单数据提交到服务器,必须提供那么属性值,服务器通过属性值获得提交的数据。

value:属性:设置input标签的默认值。submit和reset为按钮显示数据

size:大小

checked属性:单选框或复选框被选中。

readonly:是否只读

disabled: 是否可用

maxlength:允许输入的最大长度

下拉列表标签:<select>

<select> 下拉列表。可以进行单选或多选。需要使用子标签<option>指定列表项

name属性:发送给服务器的名称

multiple属性:不写默认单选,取值为“multiple”表示多选。

size属性:多选时,可见选项的数目。


<option> 子标签:下拉列表中的一个选项(一个条目)。

selected :勾选当前类表项

value:发送给服务器的选项值。


文本域标签:<textarea>

<textarea> 文本域。多行的文本输入控件。

cols属性:文本域的列数

rows属性:文本域的行数

 

按钮标签:<button>(了解)

<button type="button|reset|submit"> 按钮标签一般很少使用,提供"普通|重置|提交"功能,不同的浏览器默认值不同。

扫码关注我们
微信号:SRE实战
拒绝背锅 运筹帷幄