HTML的学习
2016-08-04 本文已影响0人
钩不了沉
1、开发网站的流程
- 与客户沟通，包括：风格的、功能（论坛、留言板、支付、用户登入等）
- 与美工沟通，制作网页效果图（首页、列表页、内容页）
- 制作人员开始切图排版，排成网页形式* 前台和后台合并一起，整站就完成了
2、网页布局结构
3、排版的准备工作
- 网站的素材：都要放在当前目录下，与当前网页放一起
- 创建一个html文件，来进行排版
- 网页的背景色
- 确定主页的宽度：778PX，当前流行的主页宽度为1000PX
4、HTML注释
<！--注释内容--> 例<!..Flash模块..>
注意：注释内容不会显示，只是为了将来维护
- 网页多媒体
<1> 网页上的视频一般都是FLASH格式，因为兼容性比较好，文件大小小的多。
<2>flash文件压缩比较小，符合快速传播
<3>Flash动画的文件扩展名是：.swf
*** 图片热点（图像地图）**
图像热点，给一张图片加多个链接，默认情况下，一张图只能加一个链接
* 标记结构：
<img scr="image/01.jpg"> usermap="#map"/>
<map id="map">
<area shape="热区形状"> coords="热区坐标" href="链接地址"
<area shape="热区形状"> coords="热区坐标" href="链接地址"
<area shape="热区形状"> coords="热区坐标" href="链接地址"
</map>
*** <area>的常用属性**
- shape:热区形状，取值：rect(矩形)、circle(圆)、ploypon(多边形)
-
coods热区的坐标（位置）
1、如果shape=rect时，那么，coords="x1,y1,x2,y2"如：coords="50,50,200,150" （x1,y1为矩形左上角点的坐标，x2,y2为矩形右下角坐标。）
2、如果shape=circle时，那么，circle="x,y，r" （其中 xy为圆心坐标，r为半径。）
Paste_Image.png
例如：
<ima src=”images/-02.jpg” usemap=”#Map”>
<map name=”Map “ id=”Map”>
<area shape=”rectcoords=”141,54,234,75” href=”maileto:jing@126.com”/>
<area shape=”rectcoords=”141,33,234,54” href=”加入收藏”/>
<area shape=”rectcoords=”141,33,234,54” href=”设为首页”/>
普通框架
- 框架的技术：将一个浏览器窗口划分成若干个小窗口，
每个小窗口显示一个独立页面。 - 框架集和框架页
- 框架集（farmeset）:主要用来划分窗口的
- 框架页（farme）：主要用来指定窗口默认显示的页面地址。
Paste_Image.png
* <frameset>属性
-
clos:划分左右型框架
clos="200," 表示做框架的宽度为200PX，剩下的是右框架的
clos="30%，" 可以用百分比来表示
*** rows**:划分上下型框架的
注意：clo和rows不能同时使用 - framborder，是否显示框架的边框线，取值1或0，yes或者no
- ** border**:边框线的粗细
- bordercolor:边框颜色
* 《frame》框架页的属性
- src:该小窗口中，默认显示的网页地址
- noresize不能调整小窗口的大小。noresize="noresize"
- scrolling是否显示滚动条，取值auto,yes,no
- name 给当前小窗口取个名字，这个名字给<a>标记的target属性来用。
Paste_Image.png
-
noframe的含义
当你的浏览器不支持框架时，显示的提示内容。。。一般情况下IE6不支持框架，高版本都支持。
语法：<noframes>对不起，你的浏览器不支持frameset元素的<noframes>
-
框架的嵌套
Paste_Image.png
Paste_Image.png
-
做左边的那一小框架（left.html）
注意：插图片是不能在上面加字的，加背景色才能加
Paste_Image.png
Paste_Image.png
总结：
- <frameset>称为普通框架
- <frameset>中，框架的制作分两个部分，如上面两个代码
（1）框架的结构 （2）制作具体的内容 - 在<frameset>的结构划分中，不能出现<body>标记，因为没有实际内容。在框架中分出的三个框架极其实就是三个网页。独立的网页。
内嵌框架（行内框架，浮动框架）
- 描述：相当于现有的网页中，挖了一个窟窿，透过这个窟窿可以看见里面的内容。
- 与<frameset>的区别：<iframe>是<body>的子标记，所以，它应该放在<body>内
- **语法格式：
<iframe 属性=“值”>对不起，你的浏览器版本太低<iframe> - 常用属性
*src:指引入的文件地址
*width:框架的宽度
*height:框架的高度
*framborder:是否显示边框，取值，yes ,no
*border：边框的粗细
*name:指定当前小窗口的名称，该名称也是给<a>标记的target属性来的
*align：框架网页的对其方式/ 其中取值left,right, - 这里的src引入的只能是html文件或者PHP文件，不能是图片
