Html是什么 超文本标记语言
Html可以做什么
html 发展历史介绍(了解)
W3c的介绍
Html和 xhtml的区别
html语言本身存在一些缺陷 而用xml替代html又为时过早,所以出现了xhtml 实现两者之间的过渡
html文件结构 标记和元素 属性 符号实体
Html运行原理
1)本地访问运行
2)远程访问运行
万维网简易示意图
Html的开发工具
记事本 dw frontpage VS....
Html的基本结构
Html的结构,在vs中新建一个编译html的文件,其在创建接口的时候包含一下内容<html>
<head>
<title>设置页面的标题(不设置时显示无标题文档)</title>
</head>存放开始信息,对网页页面的描述不会直接显示在页面上
<body>
正文内容
</body>
</html>
以上内容所有的html页面都包含这些内容。需要写完全。
Html标记及其属性
<head>头
<font color="red">hello</font>
</head>
<body>存放内容
</body>
</html>
Html符号实体介绍
<body color=”read”></body>
Html和xml的联系和区别
1、 html的属性值要用配对的符号标注起来
2、 注释都用<!----内容----->来标注
3、 Html和xml中使用的特殊字符相同
一些常用符号实体
< 小于号
> 大于号
&nbps 空格
html常用标记元素
<html>…</html> 用于标记HTML文档的开始和结束
<head>…</head> 用于写入标题和其他说明信息
<body>…</body> 网页的主体所在,用于写入文本、图像和链接。
<br/> 回车
<p/> 段落
<center>文本</center> 文本居中显示
H标签 html定义了<h1></h1>到<h6></h6>六个h标签来表示不同大小的字体
<b>a</b> 粗体
<font></font> 字体标签
<ahref =”链接地址” target=”_blank” title=”说明” >链接中文</a> (target设定链接打开方式,_blank表示在新窗口打开)站内引用使用相对URL:/表示网站根目录,../表示父目录,./表示当前目录。(此方法的好处是网站域名改变,不会影响)
<area>...</area> 标签用于标记区域
<table><tr><td></td></tr></table>标签用于创建表格(tr表示行,td表示单元格,表头的td可用th代替,表示粗体居中)cellpadding(table属性,单元格填充)cellspacing(table属性,单元格间距)rowspan(tr属性,跨行,值为要跨的行数) colspan(td属性,跨列,值为要跨的列数)
<imagesrc=”.jpg”></image> 链接图片
HTML中子标签默认继承父标签设定,如果自己单独设定,则会覆盖父标签的设定。
表格小练习——菜谱
<head>
<title>第一个网页</title>
</head>
<body>老鼠爱大米.................
<img src='油焖大虾.jpg' widh =900px border=3/>
</html>
表格小练习——课程表
html列表
无序列表 disc circle square
<table border=5 cellpadding=6 cellspacing=9 bordercolor
=blue align="center" width=500px>
<tr align="center"><td>1</td><td>2</td><td>3</td><td>4</td></tr>
<tr align="center"><td>1</td><td>2</td><td>3</td><td>4</td></tr>
<tr align="center"><td>1</td><td>2</td><td>3</td><td>4</td></tr>
</table>
有序列表 start="A"???
Html列表 - 框架
<html>
<head>
<title>好汉榜</title>
<link href="my2.css" type="text/css" rel="stylesheet"/>
</head>
<body >
梁山英雄榜</br></br>
<a href="#"><span class="style1">老员外</span></a></br></br>
<a href="#"><span class="style2">宋江</span></a></br></br>
<a href="#"><span class="style3 ">吴用</span></a></br></br>
<a href="#"><span class="style2">豹子头</span></a></br></br>
<a href="#"><span class="style4">关公</span></a></br>
</br>
</body>
</html>
Noresize框体大小不可变 frameset frame
Cols 纵向 rows 横向
框架综合练习——音乐歌词
All2.html
left.html
Top.html
Right1.html
Right2.html
form(表单)元素 各种input元素
form(表单)元素
Action提交到 reset 重置 submit 提交 hidden隐藏 checkbox 复选 radio单选
Input元素
select下拉列表 option下拉选项 textarea选择上传文件
Html常用表单 元素
alt 图片无法显示时的文本
border 边框调整
Color 颜色(同上)
Size 大小、控件宽度(数字即可)
Width 宽度
Height 高度
Face 字体(宋体,黑体,楷体,等等)
target 目标(一般设定值为_blank,新窗口打开)
Align 水平对齐(left,right,center)
Valign 垂直对齐(top,bottom,middle)
Value 设定初始值
Maxlength 限制长度
Readonly 只读(值为readonly,单值属性)
Checked 初始化选中状态(值为checked,单值属性)
Html 其它标记
各种字体、Entities
HML文件结构
语言字符集 ???
Body部分的文字 背景色背景图设置
Margin 页面留白
文字布局表格进阶多媒体页面 企业邮箱登录界面
设置边框:border-color/border-style/border-width/
设置可见:display(值为none时元素不显示)
设置鼠标指针显示:cursor(常设值有:pointer(手掌)、wait(沙漏)),可以添加url(cur或ani格式的图标自设指针形状)
设置链接:url(链接地址)
div块 文字的对齐方式
marquee 跑动文字 及其属性directio方向 behavior设置
Embed插入多媒体 href添加链接 target
企业邮箱 综合练习
<!--框架标记-->
<frameset rows="35%,*" frameborder=1 framespacing=15 bordercolor="dark" >
<frame src="top.html" scrolling="no"/ noresize>
<frameset cols='40%,60%' frameborder=3 rows=‘按照例的百分比分割’>
<frame src="left.html"/ noresize>
<frame src="right1.html" name=right/>
</frameset>