1.<a>标签,是内联标签

href:需要跳转的网址

2.id属性:

相当于一个身份证

例如:

设置id属性

3.列表标签

<ul>: 无序列表 [type属性:disc(实心圆点)(默认)、circle(空心圆圈)、square(实心方块)]

<ol>: 有序列表

<li>:列表中的每一项.

<dl>  定义列表

<dt> 列表标题

<dd> 列表项

 

4.表格标签

表格是一个二维数据空间,一个表格由若干行组成,一个行又有若干单元格组成,单元格里可以包含文字、列表、图案、表单、数字符号、预置文本和其它的表格等内容。

表格最重要的目的是显示表格类数据。表格类数据是指最适合组织为表格格式(即按行和列组织)的数据。

表格的基本结构:
<table>
<tr>
<td>标题</td>
<td>标题</td>
</tr> <tr>
<td>内容</td>
<td>内容</td>
</tr>
</table>

属性:

border: 表格边框.

cellpadding: 内边距

cellspacing: 外边距.

width: 像素 百分比.(最好通过css来设置长宽)

rowspan:  单元格竖跨多少行

colspan:  单元格横跨多少列(即合并单元格)

 练习:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
td{
text-align: center; #设置居中
}
</style>
</head>
<body>
<table border="2px" cellpadding="20px" cellspacing="1px">
<tr>
<th colspan="3">星期一菜谱</th>
</tr>
<tr>
<td rowspan="2">素菜</td>
<td>清炒茄子</td>
<td>花椒扁豆</td>
</tr>
<tr> <td>清炒茄子</td>
<td>花椒扁豆</td>
</tr>
<tr>
<td rowspan="2">荤菜</td>
<td>油焖大虾</td>
<td>海参鱼翅</td>
</tr>
<tr> <td>红烧肉<img src="https://www.baidu.com/img/bd_logo1.png" width="150" height="180"></td>
<td>烤全羊</td>
</tr>
</table> </body>
</html>

5.表单标签:<form>

功能:表单用于向服务器传输数据,从而实现用户与web服务器的交互

表单能够包含input系列标签,比如文本字段、复选框、单选框、提交按钮等。

表单还可以包含textarea、selsct、filedset、和label标签

表单属性:

input标签(内联标签)

<1> 表单类型

type:        text 文本输入框
password 密码输入框
radio 单选框
checkbox 多选框
submit 提交按钮
button 按钮(需要配合js使用.) button和submit的区别?
file 提交文件:form表单需要加上属性enctype="multipart/form-data"
上传文件注意两点:
1 请求方式必须是post
2 enctype="multipart/form-data"

<2>name属性:

对应发送给服务器的key

name属性是内置的,不能更改

name:    表单提交项的键.

注意和id属性的区别:name属性是和服务器通信时使用的名称;

而id属性是浏览器端使用的名称,该属性主要是为了方便客户端编程,而在css和javascript中使用的

value:    表单提交项的值.对于不同的输入类型,value 属性的用法也不同:

type="button", "reset", "submit" - 定义按钮上的显示的文本

type="text", "password", "hidden" - 定义输入字段的初始值

type="checkbox", "radio", "image" - 定义与输入相关联的值

checked:  radio 和 checkbox 默认被选中

readonly: 只读. text 和 password

disabled: 对所用input都好使.

6.select标签

<select> 下拉选标签属性

name:表单提交项的键.

size:选项个数

multiple:multiple

<optgroup>为每一项加上分组

<option> 下拉选中的每一项 属性:

value:表单提交项的值.

                       selected: selected下拉选默认被选中

7.<textarea> 多行文本框

<form id="form1" name="form1" method="post" action="">

<textarea cols=“宽度” rows=“高度” name=“名称”>

默认内容

</textarea>

</form>

8.<label>标签(了解)

定义:<label> 标签为 input 元素定义标注(标记)。

说明:

1 label 元素不会向用户呈现任何特殊效果。

2 <label> 标签的 for 属性值应当与相关元素的 id 属性值相同

<form method="post" action="">

<label for=“username”>用户名</label>

<input type=“text” name=“username” id=“username” size=“20” />

</form>

9.<fieldset>标签(了解)

<fieldset>

<legend>登录吧</legend>

<input type="text">

</fieldset>

HTML常用标签3的更多相关文章

  1. HTML常用标签

    HTML常用标签: HTML文档格式: 首先,HTML是一种超文本标签语言,它是制作网页的基础. 其次,HTML文档中至少包含基本的和成对的<html> </html>.< ...

  2. html常用标签介绍

    常用标签介绍 文本 最常用的标签可能是<font>了,它用于改变字体,字号,文字颜色. 点击查看效果 <font size="6">6</font&g ...

  3. HTML常用标签总结

    HTML 的常用标签总结 <font size="字体大小1-7" color="red或0xff00ff" face="字体类型(楷体等)&q ...

  4. html新增一些常用标签

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. [刘阳Java]_MyBatis_映射文件的常用标签总结_第5讲

    MyBatis中常用标签的总结,简单给出自己的总结 MyBatis映射文件中的标签使用介绍1.<select>:用于编写查询语句用的标签 id:表示当前<select>标签的唯 ...

  6. CSS常用标签

    CSS常用标签 一 CSS文字属性 color : #999999; /*文字颜色*/ font-family : 宋体,sans-serif; /*文字字体*/ font-size : 9pt; / ...

  7. HTML基础(一)——一般标签、常用标签和表格

    第一部分  HTML <html>    --开始标签 <head> 网页上的控制信息 <title>页面标题</title> </head> ...

  8. HTML-学习笔记(常用标签)

    本篇博客讲一讲HTML中的标签 HTML 标题 标题(Heading)是通过 <h1> - <h6> 等标签进行定义的.<h1> 定义最大的标题.<h6> ...

  9. 帝国CMS文章随机调用等一些常用标签

    1.帝国CMS文章随机调用等一些常用标签 [e:loop={'news',10,18,0,'newstime>UNIX_TIMESTAMP()-86400*7','onclick desc'}] ...

  10. 9月5日网页基础知识 通用标签、属性(body属性、路径、格式控制) 通用标签(有序列表、无序列表、常用标签)(补)

    网页基础知识 一.HTML语言 HTML语言翻译汉语为超文本标记语言. 二.网页的分类 1.静态页面:在静态页面中修改网页内容实际上就是修改网页原代码,不能从后台操作,数据来只能来源于原于代码.静态网 ...

随机推荐

  1. 【BZOJ4998】星球联盟

    题解: 应该还是比较水的 首先很容易发现的就是两个点一旦联通他们就永远联通了 所以联通之后我们就把他们之间缩成一个点

  2. Codeforces 436E Cardboard Box (看题解)

    Cardboard Box 贪了个半天贪不对, 我发现我根本就不会贪心. 我们先按b排序, 然后枚举选两颗心的b的最大值, 在这个之前的肯定都要选一个, 因为前面的要是一个都没选的话, 你可以把当前选 ...

  3. Flask---第一个例子--使用Flask写的【Hello World !】的web程序

    from flask import Flask;------->引入Flask插件,pip install Flask; app=Flask(__name__) #变量app是Flask的一个实 ...

  4. 2018牛客网暑假ACM多校训练赛(第三场)G Coloring Tree 计数,bfs

    原文链接https://www.cnblogs.com/zhouzhendong/p/NowCoder-2018-Summer-Round3-G.html 题目传送门 - 2018牛客多校赛第三场 G ...

  5. easyui 信息提示

    /*消息提示begin*/jQuery.Info = function (msg) { $.messager.alert("温馨提示", msg, "info" ...

  6. sql 分隔字符串函数

    USE [tms]GO/****** Object: UserDefinedFunction [dbo].[fn_ConvertListToTable_Sort] Script Date: 2017/ ...

  7. POJ-1679 The Unique MST (判断最小生成树的唯一性)

    <题目链接> 题目大意: 给定一张无向图,判断其最小生成树是否唯一. 解题分析: 对图中每条边,扫描其它边,如果存在相同权值的边,则标记该边:用kruskal求出MST. 如果MST中无标 ...

  8. UVa11988 Broken Keyboard 损坏的键盘【list】

    题目链接:https://vjudge.net/problem/UVA-11988 题目大意: 键盘的home键和end键出现了问题. 在输入一段文本时,home键或end键可能会自动被按下,home ...

  9. suctf逆向部分

    自己真的菜,然后在网上找了一篇分析pyc反编译后的文件然后进行手撸opcode,过程真痛苦 http://www.wooy0ung.me/writeup/2017/10/11/0ctf-quals-2 ...

  10. Windows下MySQL绿色版安装配置与使用

    Mysql-5.7.11-winx64操作步骤: 一.安装MySQL数据库 1.下载. 下载地址: http://downloads.mysql.com/archives/get/file/mysql ...