菜鸟快速读懂HTML语言

  HTML语言是网页制作的基础,是初学者必学的内容。虽然现在有许多所见即所得的网页制作工具,但是说到底,还是有必要了解一些HTML的语法。这样,您可以更精确的控制页面的排版,可以实现更多的功能。HTML语言可直接使用普通的文本编辑器进行编辑(例如:DOS下的EDITWindows中的记事本等)。

  小技巧:如何查看别人网页的HTML

  你只要用浏览器(例如:IE)打开某网页(例如:),然后用鼠标右键点击网页中的空白位置,选择“查看源文件”,此时这个网页的源文件就一览无遗了。如果遇到有些网页屏蔽右键菜单的话,那么可以选择“查看→源文件”查看源文件。

  一、HTML标记的约定

   HTML语言是网页制作的基础,是初学者必学的内容。虽然现在有许多所见即所得的网页制作工具,但是说到底,还是有必要了解一些HTML的语法。这样,您可以更精确的控制页面的排版,可以实现更多的功能。HTML语言可直接使用普通的文本编辑器进行编辑(例如:DOS下的EDITWindows中的记事本等)。

   在HTML中,标记是用来界定各种单元,如标题、段落、列表等。HTML单元由三部分组成:起始标记、单元内容、结束标记。起始标记由“<”和“>”来界定,结束标记由“</”和“>”来界定,单元名称和属性由起始标记给出。如:“<TITLE>走进数码网--数码时代的电脑应用专家</TITLE>”,“<TITLE>”和“</TITLE>”是起始标记和结束标记,“走进数码网--数码时代的电脑应用专家”是单元的基本内容。

  1.超文本标记用带尖挎号“<”和“>”表示。

  2.超文本标记一般是成对出现,用带斜杠的元素表示结束,如:<html>和</html>。但有些标记只有起始标记而没有结束标记,如:<BR>,它网页中表示引入一个换行动作还有些标记可以省略,如:段落的结束标记</P>就可以省略。

  3.超文本标记忽略大小写,如:<HTML>和<html>是等效的,但其中实体内容的名称是要区分大小写,如"&NAME"和"&name"是表示不同的实体。

  4.一个标记元素可写在多行,参数位置不受限制。

  二、HTML主要标记的用法

   HTML文档的标记在该语言中占有重要的地位,可以说,整个HTML文档都是它的标记构成的,HTML文档的标记为编写该文档建立了固定的框架,我们只要在这个框架中填充内容就行了。但你可能会对HTML语言,而感到一头雾水吧?

   其实您可以将HTML文档分成两部分:首部信息和正文主体。其具体的结构如下:
   <HTML>
   <HEAD>
   首部元素、元素属性及基本内容。
   </HEAD>
   <BOBY>
   主体元素、元素属性及基本内容。
   </BOBY>
   </HTML>

   首部元素中的内容在浏览器中是不被显示出来,它主要是浏览器使用首部来收集有关页面的各种信息。我们在浏览器中看到的是<BOBY>和</BOBY>之间的内容。在此就不再对各元素的应用进行详细说明,下面主要介绍一些元素的含义。

  1.主窗体元素含义

  <HTML>和</HTML>:超文本的开始和结束。
  <HEAD>和</HEAD>:超文本标题的开始和结束。
  <TITLE>和</TITLE>:超文本窗口标题的开始和结束,它被显示在浏览器顶端的标题栏中。
  <META>:是用来描述HTML文档的元信息,即文档文档自身的信息。
  <BODY>和</BODY>:正文的开始和结束,它被显示在浏览器中。其中可以包含许多元素,是HTML语言的核心部分。

  主要属性:

  background=url:指定背景图片,由属性url指定位置。
  bgcolor=color:指定文档中的背景颜色
  text=color:指定文档中的文本颜色
  link=color:指定尚未访问的超链接的颜色
  alink=color:指定活动的超链接的颜色
  vlink=color:指定访问过的超链接的颜色
  HTML使用的颜色可用颜色十六进制的RGB值来表示,也可以用颜色英文名来表示,例如颜色RGB值"#000000"和颜色英文名"Black"都表示黑色。附常见颜色对照表,如下表。

  2.字符风格控制元素含义
  <H1></H1>到<H6></H6>:定义字体的大小。
  <B>和</B>:字体加粗。
  <I>和</I>:字体变斜体。
  <U>和</U>:字体加下划线。
  <S>和</S>:字体加中划线。
  <SUP>和</SUP>:字体为上标。
  <SUB>和</SUB>:字体为下标。
  <FONT>和</FONT>:定义字体属性。
  FONT的主要参数:
  size:定义字体的大小。
  color:定义字体的颜色。
  center:对齐方式。

  3.版面控制元素含义

  <PRE>到</PRE>:空格、回车有效。
  <ALIGN>和</ALIGN>:对齐方式,主要参数有左对齐:LEFT右对齐:RIGHT居中对齐:CENTER。
  <P>和</P>:段落的开始和结束。
  <HR>:加划线。
  <IMG SRC=...>:插入图片。

  4.标题分级控制元素含义

  <UL>和<OL>:标题分级方式。
  <LI>:子标题。

  5.锚元素含义

  <a href="链接地址">和</a>:锚元素的开始和结束。
  例如:
  "/",是表示http链接。
  "mailto:info@webjx.com",是表示邮件链接。
  "file://c:/index.html",是表示本地文件链接。
  "ftp://ftp.webjx.com/",是表示FTP文件下载链接。

  6.表格元素含义

  <TABLE>和</TABLE>:表格的开始和结束。
  <CAPTION>和</CAPTION>:表格标题的开始和结束。
  <TR>和</TR>:行的开始和结束。
  <TH>和</TH>:栏标题的开始和结束。
  <TD>和</TD>:栏的开始和结束。
  主要参数:
  ALIGN:横向定位
  VALIGN:纵向定位
  BORDER:表格边宽
  COLSPAN:单元所占栏数
  ROWSPAN:单元所占行数

  7.交互元素含义

  <FORM NAME="" ACTION="URL" METHOD=GET|POST>
  <INPUT TYPE="TEXT">:文本框。
  <INPUT TYPE="PASSWORD">:密码输入。
  <INPUT TYPE="CHECKBOX">:单选框。
  <INPUT TYPE="RADIO">:收音机按钮。
  <INPUT TYPE="IMAGE">:图象。
  <SELECT>和</SELECT>:下拉式选单。
  <SELECT MULTIPLE>和</SELECT>:多项选择。
  <TEXTAREA COLS=N ROS=N>和</TEXTAREA>:文字输入区。
  <INPUT TYPE="SUBMIT">:提交传送到服务器。
  <INPUT TYPE="RESET">:清除已输入信息。

时间: 2024-08-22 15:21:21

菜鸟快速读懂HTML语言的相关文章

不懂Ruby的程序员,如何快速读懂Ruby代码

本问答的目标读者是不了解Ruby语言.但有别的编程语言经验的人. Ruby语言的代码可读性是很强的.本问答只把一些语法特点.以及别的语言中可能没有或不同的东西展现出来,目的在于让有别的编程语言经验的人能快速读懂Ruby代码. 注意本问答讲的是Ruby语言本身(基于版本1.9),而不是Ruby on Rails,后者是Ruby的一种DSL,语言面貌上和Ruby有一定差异.   Q:Ruby最有特点的语法形式是什么? 或许是方法后接代码块的大量使用,以下面这行代码为例: file.each_line

一文读懂Go语言的net/http标准库

点击标题下「异步图书」可快速关注 在进行Web应用开发的时候,使用成熟并且复杂的Web应用框架通常会使开发变得更加迅速和简便,但这也意味着开发者必须接受框架自身的一套约定和模式.虽然很多框架都认为自己提供的约定和模式是最佳实践(best practice),但是如果开发者没有正确地理解这些最佳实践,那么对最佳实践的应用就可能会发展为货物崇拜编程(cargo cult programming):开发者如果不了解这些约定和模式的用法,就可能会在不必要甚至有害的情况下盲目地使用它们. 货物崇拜编程 第

快速读懂机器学习(附送详细学习资源)

前言: 机器学习作为人工智能中的伟大分支,让我们先来聊聊人工智能把.现在人工智能已经非常普遍了,从之前的阿尔法狗到现在中国人工智能机器人解答北京高考数学卷 考了105分.以及2017.6.6的苹果WWDC大会上宣布开发机器学习API,苹果想通过借此之举,让更过苹果开发者用户开发出更过用户体验好的应用,人工智能的例子真是数不胜数,已经渗透到我们生活的各方各面,比较常见的比如金融以及医疗,而且之前看了一篇文章这样评价金融业:随着人工智能的发展与普遍,以后金融业对求职者的要求需要掌握人工智能相关知识来

一文读懂R语言 R可以做所有SAS做的事情

以下5种语言 NODE.LUA.Python.Ruby.R ,哪个在2014年的应用前景会更好? 我毫不犹豫的选择R.R不仅是2014年,也是以后更长一段时间的主角. 1. 我的编程背景 本人程序员.架构师,从编程入门到今天,一直深信着Java是改变世界的语言,Java已经做到了,而且一直很辉煌.但当Java的世界越来越大,变得无所不能的时候,反而不够专业,给了其他语言发展的机会. 本次要比较要5种编程语言(NODE,LUA,Python,Ruby,R),这些都是非常优秀的,在特定领域发展壮大的

5个问题快速读懂今起实施的《网络安全法》

我们所知的<中华人民共和国网络安全法>是去年11月7日通过,并从今年6月1日也就是今天开始施行的.就该法律的获准通过及其解读,FreeBuf还曾专访过段和段律师事务所创始人刘春泉律师,主要就其对企业安全可能产生的影响做了相对深入的解读. 路透社先前发表的评论文章中援引了美国商会主席James Zimmerman的话,他认为中国的这项法律"模糊,暧昧,监管机构完全可以对其进行各种解读":不过我们知道,<网络安全法>是中国第一部有关网络安全的基础性."大纲

7张图读懂2015年放假安排有亮点

今天下午,国务院办公厅正式公布了2015年的节假日安排,最大的惊喜莫过于除夕又重新回归国家法定假节日行列.1.元旦1月1日-3日放假调休,4日(星期日)上班:2.春节:2月18日(除夕)-24日放假调休:3.清明节:4月5日放假,6日(星期一)补休 :4.劳动节:5月1日放假,与周末连休:5.端午节:6月20日-22日放假:6.中秋节:9月27日放假:7.国庆节:10月1日-7日放假,10月10日(星期六)上班.不过,面对这一天调休,那一天放假的安排是否觉得很难记住?中国新闻网独家制作了7图,让

十种程序语言帮你读懂大数据的“秘密”

文章讲的是十种程序语言帮你读懂大数据的"秘密",随着大数据的热潮不断升温,几乎各个领域都有洪水倾泻般的信息涌来,面对用户成千上万的浏览记录.记录行为数据,如果就单纯的Excel来进行数据处理是远远不能满足的.但如果只用一些操作软件来分析,而不怎么如何用逻辑数据来分析的话,那也只是简单的数据处理. 替代性很高的工作,而无法深入规划策略的核心. 当然,基本功是最不可忽略的环节,想要成为数据科学家,对于这几个程序你应该要有一定的认识: R 若要列出所有程序语言,你能忘记其他的没关系,但最不能

独家 | 一文读懂Hadoop(二)HDFS(上)

随着全球经济的不断发展,大数据时代早已悄悄到来,而Hadoop又是大数据环境的基础,想入门大数据行业首先需要了解Hadoop的知识.2017年年初apache发行了Hadoop3.0,也意味着一直有一群人在对Hadoop不断的做优化,不仅如此,各个Hadoop的商业版本也有好多公司正在使用,这也印证了它的商业价值. 读者可以通过阅读"一文读懂Hadoop"系列文章,对Hadoop技术有个全面的了解,它涵盖了Hadoop官网的所有知识点,并且通俗易懂,英文不好的读者完全可以通过阅读此篇文

一张图读懂阿里巴巴收购的背后逻辑

阿里巴巴即将在美上市,之前频繁传出的各种资本动作似乎也接近了尾声,而此时各种关于"商业道德"."缄默期"主题的讨论充斥在各种媒体,仿佛这个世界进入了一个翻家底的阶段,只是这种动作有些让人感觉怪怪的. 如今趁着难得的寂静期,宏观上总结下阿里巴巴过往一段时间眼花缭乱资本收购的背后逻辑,看看素有商业哲学家称号的马先生到底在下一盘什么棋?说实话道哥还真不擅长这么高大上的活儿,不过也硬着头皮上了. 一张图读懂阿里巴巴的战略逻辑 电商业务是阿里巴巴的核心主业,也是其发家的起点,