`
piperzero
  • 浏览: 3479888 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
文章分类
社区版块
存档分类
最新评论

html常用标签组成的页面

 
阅读更多

发表个html常用标签组成的页面,没事儿抄几遍,方便把标签都背下来。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title> 这是测试页</title>
<!-- <base href=""> 存在引起了锚点定向错误,要如何解决?-->
<link rel="StyleSheet" type="text/css" href="css/index.css">
<meta name="网页描述信息">
<meta keywords="网页关键字">
<meta description="文本描述">
<meta robots="all">
<meta author="作者">
<meta copyright="版本信息">
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<meta http-equiv="refresh" content="5000;url=http://baidu.com">

</head>
<body>
这是换行标签<br> <!--这是换行标签-->
<p>段落标签</p>
<center>居中标签</center>
<pre>

左 右======留存格式!

</pre>
<ul><li>无序列表</li></ul>
<ol><li>有序列表</li></ol>
<hr width="90%" size="20" color="blue" noshade> <!--横隔线 宽、高、颜色、无阴影 -->

<h1>标题行h1注意只有一个</h1>
<h2>h2</h2>
<h3>h3</h3>
<h4>h4</h4>
<h5>h5</h5>
<h6>h6</h6>
<b><u><i>黑 下划线 斜体</i></u></b> <br>
<font face="楷体_Gb2312" color="blue" size="5">楷体蓝色大小为5</font> <br>
<tt>打印机文字</tt> <br>
<cite>举例的斜体字</cite> <br>
<em>强调的斜体字</em><br>
<strong>强调的黑体字</strong><br>
<small>小型字体</small><br>
<big>大型字体</big>

<a href="1.htm" target="_blank">one</a><br> <!--还有 _self标志-->
<a href="#one">跳转至锚点1</a><br>
<a href="http://test1.htm#two">跳转至其他页面锚点2</a><br>
<a name="one">锚点1的文档内容...
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa<br>
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa<br>
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa<br>
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa<br>

</a><br>
<a href="#">跳转回页首</a><br>


<a href="http://test.htm" target="_self"><img src="weave.png" border="5" height="150" width="30%" alt="这是一个图片链接,logo.jpg、边框5,高度300,宽度占浏览器30%"></a><br>

<table border="1" width="50%" height="150" align="center" cellspacing="0" cellpadding="5" bgcolor="#cccccc" bordercolor="green">
<caption><h2>测试学员表</h2></caption>
<tr align="center">
<td colspan="3">学生基本信息</td>
<td colspan="2">成绩</td>
</tr>
<tr>
<th>姓名</th> <!--th标签为专门字段名-->
<th>性别</th>
<th>专业</th>
<th>课程</th>
<th>分数</th>
</tr>
<tr align="center">
<td>小峰</td>
<td>男</td>
<td rowspan="2" valign="bottom">计算机</td>
<td rowspan="2" valign="top">PHP开发</td>
<td>86</td>
</tr>
<tr align="center">
<td>小樱</td>
<td>女</td>
<td>98</td>
</tr>

</table>
<br>

<table align="center" border="1" cellspacing="0" cellpadding="5" width="60%">
<caption><h3>表单的应用实例</h3></caption>
<form name="login" action="login.php" method="post" target="_blank" title="表单应用" enctype="multipart/form-data">
<tr>
<th>文本域</th>
<td><input id="user" type="text" name="uesrname" size="30" maxlength="10" value="username">
</td>
</tr>
<tr>
<th>密码域</th>
<td><input type="password" name="pass" size="32" value="hello">
</td>
</tr>
<tr>
<th>复选框</th>
<td>
<input type="checkbox" checked name="del[]">玩游戏
<input type="checkbox" name="del[]">看电影
<input type="checkbox" name="del[]">听音乐
<input type="checkbox" name="del[]">旅游
<input type="checkbox" name="del[]">看书
<input type="checkbox" name="del[]">写字
</td>
</tr>
<tr>
<th>单选框1</th>
<td>
<input type="radio" name="sex" checked>男
<input type="radio" name="sex">女
<input type="radio" name="sex">保密
</td>
</tr>
<tr>
<th>复选框2</th>
<td>
<input type="radio" name="sex1">男
<input type="radio" name="sex1" checked>女
<input type="radio" name="sex1">待定
</td>
</tr>
<tr>
<th>上传文件enctype="multipart/form-data"</th>
<td>
<input type="file" name="pic_file">
</td>
</tr>
<tr>
<th>单选式下拉列表</th>
<td>
<select id="gn" name="gn">
<option value="0">---请选择---</option>
<option value="1">赋值为1</option>
<option selected>默认选择2</option>
<option>没赋值直接为选项内容</option>
</select>
</td>
</tr>
<tr>
<th>非下拉式列表</th>
<td>
<select id="gn1" name="gn1" size="4" multiple> <!--可以显示4行的多选列表-->
<option>111111</option>
<option>222222</option>
<option>333333</option>
<option>444444</option>
<option>555555</option>
</select>
</td>
</tr>
<tr>
<th>多行文本域</th>
<td>
<textarea cols="40" rows="6" name="message">请在这里输入消息40列6行,实际内容输入量不限 </textarea>
</td>
</tr>
<tr>
<input type="hidden" name="id" value="100"><!--这个是隐藏的值,不显示在网页上-->
</tr>
<tr>
<td colspan="2" align="center">
<input type="submit" name="sub" value="提交">
<input type="image" src="dl.gif">
<input type="reset">
<input type="button" value="清空">
</td>
</tr>
</form>

</table>

</body>
</html>

分享到:
评论

相关推荐

    HTML常用标签大全及html标签的特点

    首先要知道html标签的一些特点: 1.类似“&lt;关键字&gt;”这样由尖括号包关键字组成,例如&lt;html&gt;,…… 2.一般是成对出现的,由开始标签类似“元素内容”,左边标签一边叫开始标签,右边&lt;/ &gt;叫结束标签,...

    前端css+html+布局笔记

    常用标签 &lt;html&gt; 网页的根标签 一个页面中有且只有一个根标签 网页中的所有内容都需要写在html标签的内部 网页的头部 该标签中的内容不会在网页中直接显示 该标签用于帮助浏览器解析页面 子标签 ...

    javaScript基础

    2. 在html页面中引用javaScript有三种方式:直接把javaScript代码写在标签script和/script结束标签之间,使用外部javaScript文件或直接把简短的javaScript代码写在html标签中 3. javaScript的核心语法有变量的声明和...

    html入门到放弃笔记

    1、HTML文档的组成 1、文档类型声明 告知浏览器当前的HTML文档用的是哪个版本 在网页的最顶端 &lt;!doctype html&gt; 2、由一对 html 根标记,来表示页面的开始与结束 Demo : 1、在 htdoc 中,创建一个网页 01-...

    工程硕士学位论文 基于Android+HTML5的移动Web项目高效开发探究

    媒体查询 CSS媒体查询允许开发者基于浏览网站的设备的特性来应用不同的样式申明,最常用的特性是视口宽度。 GCF 谷歌内嵌浏览器框架, 使用此插件,用户可以通过Internet Explorer的用户界面,以Chrome内核的渲染方式...

    超经典的Web前端与移动开发基础视频 Web前端基础开发视频教程 移动开发基础视频教程

    15前端开发基础视频-网页的组成html+css+JavaScript.avi 16前端开发基础视频-HTML的页面结构.avi 17前端开发基础视频-HTML的语法.avi 18前端开发基础视频-HTML的文档声明标签.avi 19前端开发基础视频-HTML的...

    IBM WebSphere Portal门户开发笔记01

    2、IBM PORTAL WCM 常用标签 212 十三、关于使用WCM API获取内容的小经验 213 十四、WCM API 215 1、工作空间获取 215 2、DOCUMENT OBJECT 215 3、输出一条具体的内容 215 4、内容组件容器接口 216 5、内容对象 216 ...

    css选择器优先级深入理解

    1.标签选择器 每个html页面都由很多个标签组成,通过标签选择器可以对某类标签应用相应的样式,如对p标签应用下面的样式,则页面中所有的p标签都会生效 复制代码代码如下: p{ font-size:12px; color:red; ...

    firefox 14 和网页开发的插件

    普通的一个网页在前端设计师 们眼中,不仅是单纯的文字图片,而是各种网页标签组成的结构图,但这些画面纯粹存在于设计师们的大脑中,X-Ray提供了一个让让它视觉化的方法,尤其是 在浏览别人的网站时尤其有用。...

    KineticJS 史上最全教程+API

    KineticJS首先是要绑定到HTML页面上的一个DOM容器元素上,比如最常用的标签。KineticJS在此容器中创建一个称之为舞台(stage)的结构,这个舞台由一个不可见的后台层和一个不可见的缓冲层组成,提供了高性能的路径和...

    ASP.Net.Web程序设计

    从结构上讲,HTML文件由元素组成,组成HTML文件的元素有许多种,用于组织文件的内容和知道文件的输出格式。HTML通过使用标记和元素来建立文件,其中利用标记来控制文件的结构。一个标准的HTML文件是以&lt;html&gt;标记开始...

    ASP.NET的网页代码模型及生命周期

    ASP.NET网页一般由三部分组成,这三个部分如下所示。 q 可视元素:包括HTML,标记,服务器空间。 q 页面逻辑元素:包括事件处理程序和代码。 q designer.cs页文件:用来为页面的控件做初始化工作,一般只有ASP.NET...

    Java-Web程序设计(PPT).pptx

    会话跟踪技术 8 9 9.EL表达式 10 10.JSTL标签库 Java-Web程序设计(PPT)全文共389页,当前为第2页。 本章内容 Web 应用程序简介 HTTP 协议 Tomcat 简介 使用Eclipse开发Java Web 应用程序 静态的登录页面制作 使用...

    css--实验报告.doc

    2、掌握了CSSde 创建及管理方式和其中常用的属性,应用css+DIV进行页面布局的DIV标记,SPNA标记, 盒子模型,元素的定位方式,布局流程和常用的布局类型。 3、学会了应用SCC+DIV对"北京奥运混吉祥物——福娃"网站的...

    【Flask】学习——Web表单(普通表单和Flask-WTF)

    它是HTML页面中负责数据采集的部件,表单有三个部分组成:表单标签、表单域、表单按钮。表单允许用户输入数据,负责HTML页面数据采集,通过表单将用户输入的数据提交给服务器。 在FLask中,为了处理web表单,一般...

    JSP动态网站开发基础教程与实验指导(从基础到应用)光盘

    全书共分12章,介绍了,JSP开发环境配置,页面组成元素,内置对象,访问数据库技术,JavaBean,Servlet技术,以及开发JSP技术需要掌握的HTML基础知识。《JSP动态网站开发基础教程与实验指导》最后提供了三个综合开发...

    java web技术开发大全(最全最新)

    2.2.1 Java.Welb程序的基本组成 2.2.2 Java,Web程序的目录结构 2.2.3 JavaWeb程序的配置文件 2.3 MVC模式与MvC框架 2.3.1 JSP模型1和JSP模型2 2.3.2 Web应用程序需要的基础服务 2.3.3 MVC模式概述 ...

    Java语言基础下载

    GUI概述及组成 156 Swing优点 157 布局管理器 158 BorderLayout 159 GridLayout 161 CardLayout 162 GridBagLayout 164 实例分析 165 内容总结 172 独立实践 173 第十一章 线程 174 学习目标 174 线程的概念 175 ...

    java web开发技术大全

    2.2.1 Java.Welb程序的基本组成 2.2.2 Java,Web程序的目录结构 2.2.3 JavaWeb程序的配置文件 2.3 MVC模式与MvC框架 2.3.1 JSP模型1和JSP模型2 2.3.2 Web应用程序需要的基础服务 2.3.3 MVC模式...

    JavaScript详解(第2版)

    1.4 JavaScript及其在Web页面中的位置 3 1.5 Ajax是什么 5 1.6 JavaScript是什么样子的 6 1.7 JavaScript及其在Web开发中承担的角色 7 1.8 JavaScript和事件 9 1.9 标准化JavaScript和W3C 11 1.9.1 ...

Global site tag (gtag.js) - Google Analytics