关于WEB

采用B/S计算模式开发的应用程序我们一般称为Web应用程序。

WEB三大层面：

网页的结构部分：结构的定义使用HTML语言（超文本标记语言Hyper Text Mark Up Language）。

网页的表现部分：编写文档表现形式的语言是CSS语言（层叠样式表Casading Style Sheet）。

网页的行为部分：标准的脚本语言JS(Java Script)。

访问网页上所有对象：DOM（文档对象模型Document Object Model）。
（均由W3C定义）

HTTP协议（超文本传输协议）：实现Web浏览器和Web服务器之间的通讯。

网页的分类：静态网页、客户端动态网页、服务端动态网页。

这段时间打算把web的相关知识都梳理一下，那么我们就从HTML这个老朋友开始吧，HTML 很容易学习相信你会喜欢它的！

<html>

<body>

    <h1>My First Heading</h1>

    <p>My first paragraph.</p>

</body>

</html>

什么是 HTML？

HTML 是用来描述网页的一种语言。

  • HTML 指的是超文本标记语言 (Hyper Text Markup Language)
  • HTML 不是一种编程语言，而是一种标记语言 (markup language)
  • 标记语言是一套标记标签 (markup tag)
  • HTML 使用标记标签来描述网页

HTML 标签

HTML 标记标签通常被称为 HTML 标签 (HTML tag)。

  • HTML 标签是由尖括号包围的关键词，比如 <html>
  • HTML 标签通常是成对出现的，比如 <b> 和 </b>
  • 标签对中的第一个标签是开始标签，第二个标签是结束标签
  • 开始和结束标签也被称为开放标签和闭合标签

HTML 文档 = 网页

  • HTML 文档描述网页
  • HTML 文档包含 HTML 标签和纯文本
  • HTML 文档也被称为网页（Web 浏览器的作用是读取 HTML 文档，并以网页的形式显示出它们。浏览器不会显示 HTML 标签，而是使用标签来解释页面的内容。）
  • <html> 与 </html> 之间的文本描述网页
  • <body> 与 </body> 之间的文本是可见的页面内容
  • 添加XHTML文档正文　
定义正文的标题

　　<h1>Heading </h1>

　　<h2>Heading </h2>

　　<h3>Heading </h3>…

定义一个段落

　　<p>Paragraph</p>


定义应用文本

　　<blockquote>block quote</blockquote>



定义列表

　　有序列表（Ordered List）

　　　　<ol>

　　　　　　<li>List<li>

　　　　<ol>

　　无序列表（Unordered List）

　　　　<ul>

　　　　　　<li>List<li>

　　　　<ul>

　　定义列表 (Defined List）定义列表（一般用于内容解释）

　　　　<dl>

　　　　　　<dt>List<dt>

　　　　　　<dd>List<dd>

　　　　<dl>



定义预编排文本（被包围在 pre 元素中的文本通常会保留空格和换行符）

　　<pre>pre</pre>

定义分区块文本

　　<div>

　　　　Division

　　</div>


版权符
&copy;
缩写说明
　　<abbr title="Hyper text Markup Language">HTML</abbr>

跨字符元素 　　
　　<span> </span> 

创建超链接

　　<a href=””></a>



显示图形

　　<img src=””/>



插入多媒体信息

　　添加Flash文件

　　　　<object data="flash文件路径" type="application/x-shockwave-flash" width="宽度" height="高度">

　　　　　　<param name="" value=""/>

　　　　</object>

　　添加视频文件

　　　　<object data="wmv文件路径" type="video/x-ms-wmv" width="宽度" height="高度">

　　　　　　<param name="" value=""/>

　　　　</object>



插入表格状数据

　　<table>

　　　　<th>标题</th>

　　　　<tr>行

　　　　　　<td>列</td>

　　　　</tr>

　　</table>

在网页中插入其他网页

　　<iframe src="URL" frameborder=""></iframe>
  • 2 XHTML元素分为块级元素和内嵌元素两种

块级元素（div、blockquote、列表、fieldset、from、h1-h6、hr、p、pre、table等）定义的文本是换行的，下一元素在浏览器下一行显示。

内嵌元素（span、a、img、label、所有表单输入元素、iframe、object等）定义的文本是不换行的，下一元素在该元素同一行的后续位置显示。

  • 3 XHTML表单

① 表单的各种类型

<form action="" method="get">

<input type="text" value=""/> 文本框

<input type="button" value=""/> 普通命令按钮

<input type="submit" value=""/>提交按钮

<input type="reset" value=""/>重置按钮

<input type="image" value=""/>图像按钮（可替换提交和重置）

<input type="checkbox"value=""/>复选框

<input type="radio" value=""/>单选框

<input type="password" value=""/>密码口令框

<input type="file" value=""/>文件上传控件

<input type="hidden" value=""/>隐藏字段

<textarea name="" id="" cols="" rows=""></textarea>多行文本框

下拉列表

<select name="" id="">

<option value=""></option>

<option value=""></option>

</select>

</form>

② 其它表单元素和属性

readonly属性：可以防止修改文本框的属性。

disabled属性可以使输入的控件不可用。

label元素：文本标签。

fieldset元素：用作表单元素的容器，在被包含的元素周围显示一个细边框的盒子。

legend元素：放在fieldset元素内部，在盒子上加一个标题。

③理论

HTML表单标记元素和属性分为两类：定义表单整体结构；创建输入对象。

在<from>标记中必须使用的两个关键属性action和method。其中action属性使用一个URL来指定表单处理程序的位置；method属性指定表单数据是如何创送到表单处理程序，method属性的值有两种get或post。

 

再谈HTML的更多相关文章

  1. [转载]再谈百度：KPI、无人机，以及一个必须给父母看的案例

    [转载]再谈百度:KPI.无人机,以及一个必须给父母看的案例 发表于 2016-03-15   |   0 Comments   |   阅读次数 33 原文: 再谈百度:KPI.无人机,以及一个必须 ...

  2. Support Vector Machine (3) : 再谈泛化误差（Generalization Error）

    目录 Support Vector Machine (1) : 简单SVM原理 Support Vector Machine (2) : Sequential Minimal Optimization ...

  3. Unity教程之再谈Unity中的优化技术

    这是从 Unity教程之再谈Unity中的优化技术 这篇文章里提取出来的一部分,这篇文章让我学到了挺多可能我应该知道却还没知道的知识,写的挺好的 优化几何体   这一步主要是为了针对性能瓶颈中的”顶点 ...

  4. 浅谈HTTP中Get与Post的区别/HTTP协议与HTML表单（再谈GET与POST的区别）

    HTTP协议与HTML表单(再谈GET与POST的区别) GET方式在request-line中传送数据:POST方式在request-line及request-body中均可以传送数据. http: ...

  5. Another Look at Events（再谈Events）

    转载:http://www.qtcn.org/bbs/simple/?t31383.html Another Look at Events(再谈Events) 最近在学习Qt事件处理的时候发现一篇很不 ...

  6. C++ Primer 学习笔记_32_STL实践与分析（6） --再谈string类型（下）

    STL实践与分析 --再谈string类型(下) 四.string类型的查找操作 string类型提供了6种查找函数,每种函数以不同形式的find命名.这些操作所有返回string::size_typ ...

  7. 再谈JSON -json定义及数据类型

    再谈json 近期在项目中使用到了highcharts ,highstock做了一些统计分析.使用jQuery ajax那就不得不使用json, 可是在使用过程中也出现了非常多的疑惑,比方说,什么情况 ...

  8. C++ Primer 学习笔记_44_STL实践与分析（18）--再谈迭代器【下】

    STL实践与分析 --再谈迭代器[下] 三.反向迭代器[续:习题] //P355 习题11.19 int main() { vector<int> iVec; for (vector< ...

  9. C++ Primer 学习笔记_43_STL实践与分析（17）--再谈迭代器【中】

    STL实践与分析 --再谈迭代器[中] 二.iostream迭代[续] 3.ostream_iterator对象和ostream_iterator对象的使用 能够使用ostream_iterator对 ...

  10. 再谈IE的浏览器模式和文档模式

    原文:再谈IE的浏览器模式和文档模式 以前在 “IE8兼容视图(IE7 mode)与独立IE7的区别”一文中曾经涉及过浏览器模式和文档模式,但二者的区别却不甚了了,现在有了新的认识,再补充一下. 1. ...

随机推荐

  1. Sbt的使用初步和用sbt插件生成eclipse工程

    以前一直是用maven去管理java项目,现在开始写scala项目了但是在scala-ide中去编译scala项目和sbt的区别一直没弄清楚受到文章:http://my.oschina.net/yjw ...

  2. 《Linux内核设计的艺术》学习笔记（六）执行setup.s

    参考资料 1. 8259A可编程中断控制器 jmpi , SETUPSEG // 0x90200 到这里,bootsect.s的执行就算结束了.控制权转移到了setup.s文件的手中. setup程序 ...

  3. Github上不错的Android开源代码（一）

    总有一些朋友很热心的整理一些好的资料,在收集之后,可以用作阅读.学习和实践.小伙伴们,总有一天,你也能写出 Niubility 的 Android App :-) 为了防止以上链接失效,以及部分内容丢 ...

  4. linux安装phpstorm出现 Startup Error: Unable to detect graphics environment

    在centos6.2下在安装phpstorm下遇到 Startup Error: Unable to detect graphics environment 其中jdk安装的版本是 1.7.0_79  ...

  5. Jquery基本、层次选择器

    基本选择器: $("#none").css("background","#bbffaa"); 改变id为none的所有元素的背景色 $(&q ...

  6. sqlserver 批量删除存储过程(转)

    sqlserver一次只能删除一个存储过程,如果多了,需要很长时间才能删完,所以写了一段语句,直接就把当然数据库下所有用户自定义的存储过程给drop了.不过使用都请留心,当前打开的数据库哦.下面贴代码 ...

  7. Div里面载入另一个页面的实现(取代框架)（AJax）（转）

    随着框架越来越不火了,HTML5就不对框架支持了,iframe也只有url了,Div就担当了此大任 DIV+CSS在页面部局确实也很让人满意,使用也更方便 今天突然遇到一个问题,那就是需要导入另一个页 ...

  8. JavaWeb学习总结（一）—JavaWeb开发入门及环境搭建

    一.基本概念 1.1.软件体系结构 1.C/S:Client/Servlet,例如QQ就是CS结构需要编写服务器端程序和客户端程序.缺点:更新需要两端,总要求客户下载新的客户端程序优点:安全性比较好2 ...

  9. JavaWeb网页聊天室（WebSocket即时通讯）

    原文:http://baike.xsoftlab.net/view/656.html Git地址 http://git.oschina.net/loopcc/WebSocketChat 概要: Web ...

  10. Bootstrap的标题

    一.定义标题 Bootstrap和普通的HTML页面一样,定义标题都是使用标签<h1>到<h6>,只不过Bootstrap覆盖了其默认的样式,使用其在所有浏览器下显示的效果一样 ...