前言

本阶段视频自己前后看了两遍，感觉效果还是不错的，鉴于昨天上午整理了一些笔记，对HTML的理解深刻了一些。所以在这篇博文中就不再解释关于HTML一些定义的东西，这篇博文主要记录一些常用标记，为以后Web开发起个好头。

内容

HTML元素的四种形式

  1. <span style="font-family:KaiTi_GB2312;font-size:18px;"><br><!--空元素-->
  2. <hr color="blue"><!--带有属性的元素-->
  3. <title>http://www.sunxin.org</title><!--带有内容的元素-->
  4. <font color="red">http://www.sunxin.org</font><!--带有内容和属性的元素--></span>

文档体

  1. <span style="font-family:KaiTi_GB2312;font-size:18px;"><html><!--开始HTML文档-->
  2.  
  3. 	<head><!--开始文档头部-->
  4.  
  5. 		<title><!--开始文档标题-->
  6.  
  7. 			name
  8.  
  9. 		</title><!--结束文档标题-->
  10.  
  11. 	</head><!--结束文档头部-->
  12.  
  13. 	<body><!--开始文档体-->
  14.  
  15. 		zhoulitong
  16.  
  17. 	</body><!--结束文档体-->
  18.  
  19. </html><!--结束HTML文档--></span>

提示：

在HTML文档中：

  • 编写HTML时，在某些情况下不按照HTML框架格式，目前我们用的浏览器（例如：IE）能够很好的解析文档。
  • 标签的属性是可选的，可以不写反之也可以。
  • 标签和名字的大小写无关。
  • 给标签赋值的时候，可以加双引号，也可以不加。如下：
  1. <span style="font-family:KaiTi_GB2312;font-size:18px;"><hr color="blue">
  2. <hr color=blue></span>

字体、段落换行、居中的应用

举例子说明：

  1. <span style="font-family:KaiTi_GB2312;font-size:18px;"><html>
  2. 	<head><title>静夜思</title></head>
  3. 	<body>
  4. 	<center><!--居中显示-->
  5. 	<h2><font color="red">静夜思</font></h2><!--二级标题-->
  6. 		          <b>作者：李白</b><!-- 为空格-->
  7. 	<hr color="blue">
  8. 	<p>
  9. 	<b><i><font color="green" size ="3">窗前明月光，疑是地上霜。<br><!--粗体、斜体3号字显示文本-->
  10. 	举头望明月，低头思故乡。</font></i></b>
  11. 	</center>
  12. 	</body>
  13. <html></span>

显示结果：

列表—建立带有项目符号的列表

  • disc   ——显示为实心的圆圈
  • square ——显示为实心的方块
  • circle ——显示为空心的圆圈

举例：

  1. <span style="font-family:KaiTi_GB2312;font-size:18px;"><ol start="10">
  2. 	<li>《红楼梦》
  3. 	<li>《三国演义》
  4. </ol>
  5.  
  6. <ol type="I">
  7. 	<li>《红楼梦》
  8. 	<li>《三国演义》
  9. </ol>
  10.  
  11. <ol type="a">
  12. 	<li>《红楼梦》
  13. 	<li>《三国演义》
  14. </ol>
  15.  
  16. <ul type="disc">
  17. 	<li>《红楼梦》
  18. 	<li>《三国演义》
  19. </ul>
  20.  
  21. <ul type="square">
  22. 	<li>《红楼梦》
  23. 	<li>《三国演义》
  24. </ul>
  25.  
  26. <ul type="cricle">
  27. 	<li>《红楼梦》
  28. 	<li>《三国演义》
  29. </ul></span>

一些常用按钮和表格的应用

下面的例子：

  1. <span style="font-family:KaiTi_GB2312;font-size:18px;"><html>
  2.       <body>
  3. 	  <form method="get" action="reg.jsp">
  4.                 <table>
  5.  
  6. 		<tr>
  7. 		<td>用户名：</td>
  8. 		<td><input type="text" name="user" value="游客" size ="30"></td>
  9. 		</tr>
  10.  
  11. 		<tr>
  12. 		<td>密  码：</td>
  13. 		<td><input type="password" name="name"></td>
  14. 		</tr>
  15.  
  16. 		<tr>
  17. 		<td>性  别：</td>
  18. 		<td>
  19. 		<input type="radio" name="sex" value="1" checked>男
  20. 		<input type="radio" name="sex" value="0">女
  21. 		</td>
  22. 		</tr>
  23.  
  24. 		<tr>
  25. 		<td>兴趣爱好：</td>
  26. 		<td>
  27. 		  <input type="checkbox" name="interest" value="football">足球
  28. 		  <input type="checkbox" name="interest" value="basketball">篮球
  29. 		  <input type="checkbox" name="interest" value="volleyball">排球
  30. 		  <input type="checkbox" name="interest" value="swim">游泳
  31. 		</td>
  32. 		</tr>
  33.  
  34. 		<tr>
  35. 		<td>最高学历：</td>
  36. 		<td>
  37. 		<select size="1" name="education">
  38. 		  <option value="" selected>...</option>
  39. 		  <option value="高中">高中</option>
  40. 		  <option value="大学">大学</option>
  41. 		  <option value="硕士">硕士</option>
  42. 		  <option value="博士">博士</option>
  43. 		</select>
  44. 		</td>
  45. 		</tr>
  46.  
  47. 		<tr>
  48. 		<td>个人简历：</td>
  49. 		<td><textarea name="personal" rows="5" cols="30"> 个人简历</textarea>
  50. 		</td>
  51. 		</tr>
  52.  
  53. 		<tr>
  54. 		<td><input type="reset" value="重写"></td>
  55. 		<td><input type="submit" value="注册"></td>
  56. 		</tr>
  57. 	</form>
  58.       </body>
  59. </html></span>

显示结果

小结

1、每次重复都有新的发现，学习就是不断重复的过程。

2、成功有时候贵在实践。

感谢您的宝贵时间~~~

再回首HTML的更多相关文章

  1. 再回首，Java温故知新——开篇说明

    不知不觉在IT界从业2年了,两年时间足够一个人成长很多,当然也会改变很多事.在这两年时间里,随着对技术的深入了解,知识面的拓展以及工作难度的增大,渐渐的感觉自己技术方面根基不稳,多数问题也只是做到知其 ...

  2. JAVA基础再回首（二十五）——Lock锁的使用、死锁问题、多线程生产者和消费者、线程池、匿名内部类使用多线程、定时器、面试题

    JAVA基础再回首(二十五)--Lock锁的使用.死锁问题.多线程生产者和消费者.线程池.匿名内部类使用多线程.定时器.面试题 版权声明:转载必须注明本文转自程序猿杜鹏程的博客:http://blog ...

  3. 再回首UML之下篇

    接着我们上篇博客再回首UML之上篇说,在类图中有四种关系,关联.依赖.泛化.实现,接下来,我们来看看依赖,依赖--描述的是一种使用关系,她说明一个事物的规格说明的变化可能影响到他使用的另一个事物,反之 ...

  4. 再回首UML之上篇

    UML,统一建模语言,是一种用来对真实世界物体进行建模的标准标记,这个建模的过程是开发面向对象设计方法的第一步,UML不是一种方法学,不需要任何正式的工作产品. UML提供多种类型的模型描述图,当在某 ...

  5. UML——再回首

    概述     在画图的过程中,发现自己还是有好多不懂的地方,对于四大关系理解的不是特别透彻,所以画图的过程中总是"剪不断,理还乱!"再一次整理四大关系,再回首必然丰收~~~ 1.实 ...

  6. 再回首，Java温故知新（一）：Java概述

    Java发展历程 Java的发展要追溯到1991年,Patrick Naughton(帕特里克·诺顿)和James Gosling(詹姆斯·高斯林)带领Sun公司的工程师打算为有线电视转换盒之类的消费 ...

  7. 再回首，Java温故知新（八）：Java基础之字符串

    字符串是Java中使用频率最高的类,但是它却不属于基本类型,而是预定义了String类来表示.从String类的源码可以看到,String是基于char[]实现的,而且Java中的String是不可变 ...

  8. 再回首，Java温故知新（七）：Java基础之运算符

    常规算数运算符 包括+.-.*./.%分别对应着加.减.乘.除.取余,算数运算符所处理的两个数字必须为同种类型,如果是不同类型且无法进行自动类型转换的话必须进行强制类型转换,不过强制类型转换可能会丢失 ...

  9. [二十六]JavaIO之再回首恍然(如梦? 大悟?)

    流分类回顾 本文是JavaIO告一段落的总结帖 希望对JavaIO做一个基础性的总结(不涉及NIO) 从实现的角度进行简单的介绍 下面的这两个表格,之前出现过 数据源形式 InputStream Ou ...

  10. MySQL数据库再回首

    前言: 数据库是程序员的数据源泉,加上近期 要开发DB可视化.性能分析的功能 重新回顾一下MySQL知识,以下是笔记: MySQL架构 MySQL基础理论 1.什么是关系型数据库? 关系型数据库,这个 ...

随机推荐

  1. Android之史上最全最简单最有用的第三方开源库收集整理

    Android开源库 自己一直很喜欢Android开发,就如博客签名一样, 我是程序猿,我为自己代言 . 在摸索过程中,GitHub上搜集了很多很棒的Android第三方库,推荐给在苦苦寻找的开发者, ...

  2. python3操作mysql数据库增删改查

    #!/usr/bin/python3 import pymysql import types db=pymysql.connect("localhost","root&q ...

  3. python 特征选择 绘图 + mine

    demo代码: # _*_coding:UTF-8_*_ import numpy as np import sys import pandas as pd from pandas import Se ...

  4. Python习题-统计日志中访问次数超过限制的IP

    #1.1分钟之内ip访问次数超过200次的,就给他的ip加入黑名单#需求分析: #1.读日志,1分钟读一次 #2.获取这1分钟之内所有访问的ip #3.判断ip出现的次数,如果出现200次,那么就加入 ...

  5. C. Jury Marks

    C. Jury Marks time limit per test 2 seconds memory limit per test 256 megabytes input standard input ...

  6. 2488 绿豆蛙的归宿（拓扑+dp）

    488 绿豆蛙的归宿  时间限制: 1 s  空间限制: 64000 KB  题目等级 : 黄金 Gold 题解       题目描述 Description 随着新版百度空间的上线,Blog宠物绿豆 ...

  7. VBScript 内置函数

    本页列出了所有内建的 VBScript 函数: Date/Time 函数 Conversion 函数 Format 函数 Math 函数 Array 函数 String 函数 其他函数 Date/Ti ...

  8. 作为.NET程序员，您需要IronPython么？

    .NET作为一个成熟的开发平台,为很多语言的发展提供了肥沃的土壤:历史相对久远的有Managed C++.C#.VB.NET.J#,正值壮年的则有IronPython.IronRuby,而老赵极力推崇 ...

  9. SQL Server：sp_send_dbmail参数设置

    sp_send_dbmail [ [ @profile_name = ] 'profile_name' ]    [ , [ @recipients = ] 'recipients [ ; n ]'  ...

  10. 人物-IT-雷军：雷军

    ylbtech-人物-IT-雷军:雷军 雷军 (全国工商联副主席,小米科技创始人.董事长) 雷军,1969年12月16日出生于湖北仙桃,毕业于武汉大学,是中国大陆著名天使投资人.  雷军作为中国互联网 ...