HTML
HTML: 是用来制作网页的。
什么是网页:
只要一个文件的后缀是html或htm，该文件就是网页文件.
如：或者
此时已经创建好一个网页了，我们直接打开这个网页，先看看里面有什么!?
我们就想办法，给这个网页中添加点内容!!
我们需要右键网页-->使用记事本打开,随便写点问候!!!
记着，编写完以后，要保存，刷新网页!!
我们知道，一个网页上的文字，有大小，有颜色.... 各种外观
我们下面就像给这个字加个颜色再说别的!
此时，我们就是想把字变成红色,咋办呢？？？
这就引出了我们要学习的科目---> html
Html是什么： hyper text markup language (超文本标记语言)
归根结底，html这是一个语言。
语言的作用是沟通：
现在要学习的html是与浏览器沟通。想让浏览器按我们的意愿去做事情，就必须精通浏览器的语言：html.
先看一个例子：
练习：
- 创建一个文本文件
- 该后缀html(或htm)
- 右键网页-->记事本打开
- 要求，写出自己的名字，和自己的座右铭， 名字和座右铭的颜色要不一样!
HTML语法：
标记(标签)：就是在 < > 之间，加入一串字母。
比如: <font> <body> <title> <head> .....
关于属性要注意的地方:
- 所有标记的属性，都必须写在开始标记中.
- 属性和属性值之间用 “=” 连接
- 属性值应该用””或者’’引起来 (标准)
D. 属性和属性之间，用空格隔开
E. 属性之间没有先后顺序
F. 在同一个标记中，同一个属性只能用1次, 如果非要把一个属性用多次，则浏览器只认第一次出现的属性
关于标记要注意的地方:
- 标记不区分大小写
B. 标记分为单标记和双标记
eg. 单标记 <br /> 特点就是，从左边开始，右边就结束，没有范围。
eg. 双标记 <font>...</font>
C. 元素 = 开始标记+中间内容+结束标记
比如<font>日出东方，唯我不败，千秋万代，一统江湖!!</font>
这就是一个font元素。
font元素的内容术语上叫做：“元素内容”
D. 所有属性，必须写在开始标记之中。
E. 标记可以嵌套， 如果嵌套的标记，与外边的标记属性有冲突，则使用就近原则!
Hbuilder的使用
标记学习
<font size=”字大小” color=”字颜色” face=”字体”></font>
<center>内容会居中</center>
<img src=”图片地址” width=”图片宽度” height=”图片高度” />
<hr width=”线的宽度” size=”线的粗细” color=”线的颜色”/>
利用以上标记制作一个简单的网页
|
<meta charset="utf-8">
<center> <font size="7"> 0905班级官方网站 </font> <br /> 首页 日志 相册 留言板 <hr /> <br /> <img src="img/1.jpg" width="200" height="150" /> <img src="img/2.jpg" width="200" height="150" /> <img src="img/3.jpg" width="200" height="150" /> <br /> <img src="img/a1.jpg" width="200" height="150" /> <img src="img/a2.jpg" width="200" height="150" /> <img src="img/a3.jpg" width="200" height="150" /> <br /> <img src="img/a4.jpg" width="200" height="150" /> <img src="img/a5.jpg" width="200" height="150" /> <img src="img/a6.jpg" width="200" height="150" /> <br /> <hr /> 班级邮箱: 0905java@163.com<br /> 班级地址: 高速大厦3楼<br /> tel: 18812345678<br />
</center>
|
之前编写的代码，都不规范！ 规范的html代码是这样的：
例子：
下面详细学习标记内容：
- 文档标记
Body: 代表网页的体部
|
属性名 |
解释 |
|
bgcolor |
控制背景颜色 |
|
background |
控制背景图片， 如果背景色与背景图一起使用，则总是显示背景图 |
|
属性名 |
解释 |
|
text |
控制整个页面范围内，所有文字的颜色 |
|
|
|
Html中的颜色表示方法
- 英文单词 red blue
- #后面跟6位16进制的数字
a) 前两位代表R (red)
b) 中间两位代表G (green)
c) 后两位代表B (blue)
d) #ff0000 就是红色 #ffff00就是黄色.....
- rgba表示法 (等学习到css再说...)
Head
Head元素中，有一个子元素:meta,非常有用。
<meta charset=”字符集” /> 用来指定浏览器使用的编码表
注意，只要编码与解码时，采用的编码表不一致，就会造成乱码！！
注意，并不是使用utf-8就“万事大吉” 而是要保证，编码与解码时的码表一致才行！！！
利用meta，定时刷新页面
<meta http-equiv="refresh" content="1;url='http://www.163.com'" />
表示，过1秒，刷新到163首页。
Title: 你懂得 <head><title>哈哈</title></head>
- 排版标记
<!-- --> 注释。
p: 段落标记，段落标记会自动换2行
|
属性 |
解释 |
|
align |
控制段落中的内容的水平对齐方式 |
|
title |
鼠标悬停在段落上的提示文字 |
|
|
|
strong：
em
U
del
sub
sup
h1...h6
ol li （order list list item）
注意，li必须用在ol里面
ul li (unorder list list item)
dl dt dd (data list data type data describe)
marquee: 滚动标记
|
属性名 |
解释 |
|
scrollamount |
滚动距离间隔 |
|
Scrolldelay |
滚动时间间隔 |
|
loop |
控制循环次数 |
|
bgcolor |
控制背景颜色 |
|
direction |
控制滚动方向 left right up down |
|
width height |
控制marquee的高宽 |
|
Behavior |
控制滚动方式 Scroll 循环滚动 Slide 只滚动一次，且保留内容 Alternate 来回滚动 |
img
A
bgsound
video
table tr td
form
Input
select
textarea
frameset
frame
iframe
