美文网首页
HTML的学习

HTML的学习

作者: 钩不了沉 | 来源:发表于2016-08-04 20:37 被阅读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文件,不能是图片

    <html>到此结束

    相关文章

      网友评论

          本文标题:HTML的学习

          本文链接:https://www.haomeiwen.com/subject/cewcsttx.html