美文网首页
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>到此结束

相关文章

  • 前端学习路线

    前端学习相关网站 1 、关于HTML的学习 对于HTML的学习分为HTML和HTML5,HTML 指的是 HTML...

  • HTML的学习

    1, 脚本标签 标签用于定义客户端脚本,比如 JavaScript。 元素既可包含脚本语句,也可通过 src 属...

  • HTML的学习

    1、开发网站的流程 与客户沟通,包括:风格的、功能(论坛、留言板、支付、用户登入等) 与美工沟通,制作网页效果图(...

  • html的学习

    互联网原理 上网就是请求数据临时文件夹例如C:\Users\Danny\AppData\Local\Microso...

  • HTML的学习

    HTML的基本知识 HTML指的是一种超文本标记语言 HTML不是一种编程语言,而是一种标记语言。 HTML使用标...

  • HTML5—HTML学习

    HTML学习感想: 下面大致的记录了一写HTML的学习笔记 什么是HTML? HTML 是HyperText Ma...

  • 04_HTML 属性

    前面我们学习了HTML的标签、元素。这次我们来学习HTML 属性。 HTML属性 HTML标签可以拥有属性。属性提...

  • HTML学习:HTML基础

    一、HTML标题 HTML 标题(Heading)是通过 ~ 标签来定义的。 定义重要等级最高的标题。 定义...

  • HTML5学习笔记之表格标签

    HTML5学习笔记之表格标签 其他HTML5相关文章 HTML5学习笔记之HTML5基本介绍 HTML5学习笔记之...

  • HTML5学习笔记之表单标签

    HTML5学习笔记之表单标签 其他HTML5相关文章 HTML5学习笔记之HTML5基本介绍 HTML5学习笔记之...

网友评论

      本文标题:HTML的学习

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