quanshiyinian 发表于 2014-8-5 19:37:44

HTML视频教程-标签,表格,框架应用,路径,图片和表单教程

HTML视频教程-标签,表格,框架应用,路径,图片和表单教程
大家好现在给大家分享教程希望对各位新手朋友们有用,下面为部分学习内容具体请看视频教程。谢谢大家!
HTML概念
•HTML(Hyper Text Markup Language 超文本标识语言)
–是一种用来制作超文本文档的简单标记语言。
–用HTML编写的超文本文件称为HTML文件,也称Web文件


HTML文档的编写方法
1.手工直接编写
–1记事本等,存成.htm .html格式
2.2使用可视化HTML编 辑 器
–    Frontpage、Dreamweaver等
      3由Web 服务器( 或称HTTP 服务器) 一 方实时动态地生成。


网页文件命名
1.          1.*.htm或*.html
2.无空格
             3.无特殊符号(例如&符号),只可以有下划线“_”,
只可以为英文、数字
4.区分大小写
5.首页文件名默认为:index.htm 或 index.html
HTML 文件结构
<html>...</html>
<head>...</head>
<body>...</body>
•元素:是HTML语言的基本部分。元素总是成对出现,每一对元素一般都有一个开始的标记(如<body>),也有一个结束的标记(如</body>)。元素的标记要用一对尖括号括起来,并且结束的标记总是在开始的标记前加一个斜杠。
HTML 文件结构
(Document Structures)
–<HTML>
•<HEAD>
–<title></title>
–<meta>
•</HEAD>
•<BODY>
– HTML 文件的正文
•</BODY>
– </HTML>
第一张网页(01.htm)
<html>      <head>       <title>第一张网页</title>      </head>      <body>      欢迎光临我的主页!      </body></html>第二张网页(02.htm)
<html>
      <head>
      <title>第一张网页</title>
      </head>
      <body>
         <p align="center">欢迎光临我的主页!</p>
      </body>
</html>
HTML基本结构的
有关元素和元素属性



•HEAD元素——1
<head>元素出现在文档的开头部分。<head>与</head>之间的内容不会在浏览器的文档窗口显示,但是其间的元素有特殊重要的意义。
•<title>
<title>元素定义HTML文档的标题。<title>与</title>之间的内容将显示在浏览器窗口的标题栏

•HEAD元素——2
•1.<meta>元素
•2.<meta>元素下面可以插入很多很有用的元素属性。下面介绍四种:
–<meta name="keywords" content="study,computer">
•用来标记搜索引擎在搜索你的页面时所取出的关键词。
•HEAD元素——3
•<meta>元素
–<meta name="author" content=“wutao">
–用来标记文档的作者。
•HEAD元素——4
•<meta>元素
–<meta http-equiv=“Content-Type” content=“text/html; charset=gb2312”>
–用来标记你的页面的解码方式
•HEAD元素——5
•<meta>元素
–<meta http-equiv=“refresh” content=“5;URL=http://www.ecust.edu.cn”>
–用来自动刷新网页
练习
•编写一个网页,要求3秒钟后自动跳转到校网主页。
<html>
      <head>
      <title>my first page</title>
      <meta http-equiv=“refresh” content=“3;URL=http://www.ecust.edu.cn”>
      </head>
      <body>
       <p align=“center”>三秒钟后本网页将自动跳转到华东理工大学首页</p>
      </body>
</html>
<body>元素及元素属性——1
<body>元素表明是HTML文档的主体部分。在<body>与</body>之间,通常都会有很多其它元素;这些元素和元素属性构成HTML文档的主体部分。
<body>元素中有下列元素属性:2
–(1)bgcolor
•bgcolor属性标志HTML文档的背景颜色。如:bgcolor=“#CCFFCC”。


HTML对颜色的控制
•HTML对颜色的控制也有自己的语法。HTML使用16进制的RGB颜色值对颜色进行控制。
•16 进制的数码有: 0,1,2,3,4,5,6,7,8,9,a,b,c,d,e,f.

常见颜色的代码

颜色
颜色名和RGB值

黑色
Black=”#000000”

银色
Silver=”#c0c0c0”

红色
Red=”#ff0000”

蓝色
Blue=”#0000ff”

白色
White=”#ffffff”

黄色
Yellow=”ffff00”

绿色
Green=”#00ff00”

海蓝色
Aqua=”#00ffff”

•<body>元素中有下列元素属性:3
–(2)background
•background属性标志HTML文档的背景图片。如:background=“images/bg.gif"。
•可以使用的图片格式为GIF,JPG


•<body>元素中有下列元素属性:4
–(3)bgproperties=fixed
•bgproperties=fixed使背景图片成水印效果,即图片不随着滚动条的滚动而滚动。

•<body>元素中有下列元素属性:5
–(4)text
•text属性标志HTML文档的正文文字颜色。如:text=“#FF6666”。Text元素定义的颜色将应用于整篇文档。

文字标签属性——1
•文字属性标记<font>..</font>
–1.文字颜色
•指定颜色 <font color=#> ... </font>
•#=RRGGBB 16 进制数码



•文字属性标记2
–2.文字字体
•<font face=“#, #, ..., #”> ... </font>
#=客户端可获得的字体
•文字属性标记 3
–3.文字大小
•<font size=#> ... </font>
•#=1, 2, 3, 4, 5, 6, 7 or +#, -#
文字布局

•行的控制
–段(Paragraph) (可以看作是空行) <p>
–空白占位符
•行的控制
•HTML的段落与段落之间有一定的空隔。如果不希望出现空隔而只想换行的话,就要用到另一个元素,即<br>元素。<br>元素可以使所在的位置出现换行。这种换行和浏览器的自动换行的效果类似。<br>元素不是成对出现的。
–不换行<nobr>

HTML文字与段落格式控制
<body>……
   <i>倾斜文本</i>
   <b>粗体文本</b>
   <u>下划线文本</u>
<s>删除线文本</s>
   ……</body>
基本组成部分—HTML注释
•HTML文档可以插入注释。注释内容不会在浏览器窗口显示
•HTML注释的格式为:
<!-- 注释内容 -- >
<!--多行注释内容 -- >
文字的对齐
<hn align=#>...</hn> (n=1,2,3,4,5,6)
<p align=#>...</p> (#=left, center, right)
3.HTML段落与分行控制
•居中--- <center>元素
–<center>元素是一个独立的使所标记的字符居中的元素。它的作用与使用<p>元素里的align=“center”类似

•例如:<center>居中段落</center>
•标尺线
<hr size = #>:设定线宽
<hr width=#>:设定线长
<hr align=#>:设定对齐方式 #=left, right
<hr color=#> :设定线的颜色
无序列表元素—1
列表在HTML的文档里有重要的地位,HTML规定了多种列表元素。列表所起的主要作用是使特定的文本有序化。
•无序列表元素—2
无序列表是由<ul>和<li>元素定义的:
<ul>
<li>sports</li>
<li> food </li>
<li> drink </li>
<li> friends </li>
</ul>
本视频来源于网络收集后盾网视频视频下载地址回复可见↓
链接: http://pan.baidu.com/s/1jG5hvBC 密码: mwmh

页: [1]
查看完整版本: HTML视频教程-标签,表格,框架应用,路径,图片和表单教程