公告:发一发站长目录为广大站长提供免费收录网站服务,VIP会员每天提交网站30、文章30免审核,快审服务(10元/站),可联系客服发布。

点击这里在线咨询客服 点击这里在线咨询客服
新站提交
  • 网站:265
  • 待审:1
  • 小程序:19
  • 文章:4046
  • 会员:166

下面是我做静态HTML网页是的问题笔记和流程。总结起来分享给大家,希望能给大家点启发。

一、准备工作
1、做HTML网页前,先要有设计图,一般由网站设计人员完成,通常用PS做。
2、依照设计图,我们做出html网页。
二、正式开始
1、先按照设计图,先在纸上大体画一下页面所有div的布局。这里我们要注意几个问题
(1)画出div布局后,需要给各div命名,学习常用的div+css的命名规则,请参考:div+css命名规则
(2)创建div时要先从最外层div开始制作,从外到内,从大到小。开始做网站时,先创建网站框架div,之后再慢慢精细化内部div
(3)写代码时,做好注释,方便自己查看每部分的代码。


(4)写CSS之初,要先定义一些全局的初始样式,如下:
*{

	padding:0px;	margin:0px;}
img { border: 0 none; vertical-align: top; }
ul, li { list-style-type: none; }


1.5、网页尽量做成响应式设计,具体设计规则请查看:《响应式web设计规则》


2、设计图和网页的大小不是1:1,怎么办?简单,把设计图的用ps更改大小,之后另存为网页,看网页显示大小是否正常,正常的话,设计图大小就已经改成网页相同了。这样我们就可以直接根据设计图的大小设计网页了。我真聪明。
 
3、在做网站时,在代码中添加作者信息,推广自己,但代码不在前台显示。
(1)在css中添加作者信息,如下格式:
/* 
Theme Name: D8
Theme URL: http://www.lazybirdfly.com/a/mbzt/
Description: 懒鸟飞主题技术支持:http://www.lazybirdfly.com">懒鸟飞
Author: 小鸟
Author URI: http://www.lazybirdfly.com
Version: 2.0
*/
(2)在代码中添加作者信息,用displa:none;属性来隐藏作者信息。
 

4、(重要)网页制作时,为了让制作的网页自动适应任何显示器,需要把外套<div class="warp">的width和height都去掉。其他需要自动适应窗口的div也不能设置固定的宽度。
 
5、让底层div浮动到上层div的上面,不能只用margin和padding定位,需要用position的绝对和相对定位来控制。用绝对定位~~上面的top大些,下面的小些就可以了~左右的话

6、织梦幻灯片宽度自适应窗。
这个很简单,找到织梦默认模板幻灯片代码,之后把宽度代码的变量swf_width,和用到的swf_width都删掉。一共删掉3个swf_width就可以了。


7、下拉菜单中添加公司简介的效果。

8、导航栏下拉菜单的样式用下面代码来控制显示。
.nav ul li subnav{ display:none; } .nav ul li:hover subnav{ display:block; } 9、用css控制背景图片位置,一个图片上的不同位置,例如下面:background-position: 0px -25px;
10、把网页保持成图片,用360浏览器,快捷键ctrl+M

11、怎样让浮动的子div自动撑大外边的父级div ,方法很简单,给父级div添加防溢出样式overflow:hidden; 就可以了。

12、在<head></head>中添加<base href="http://www.你的域名" /> 可以设置网页中所有超链接为绝对地址。
13、div背景图片自动拉伸、缩放,用下面的属性:
background-size:cover; 
14、抠图时尽量用钢笔工具,具体使用方法,可查看:
photoshop怎么用钢笔抠图
15、添加背景音乐:怎样添加网页背景音乐
16、当溢出div时,自动出现滚动条,用overflow:auto;属性。
17、为对象设置透明度,属性:
Opacity:0.5;

18、关于flash制作中的几个问题
(1)flash动画怎样自适应窗口,全屏展示
解决方法:用Dreamweaver插入swf的flash文件,之后设置flash文件宽高都为100%,并且<body>的高度也要设置为100%。
(2)flash中插入超链接,请查看:怎样给(fla文件)FLASH中添加超链接
(3)flash中插入自动跳转
在flash最后一帧,添加动作,输入:
stop();  getURL("http://www.baidu.com","_self");
(4)压缩flash的方法:压缩FLASH网络广告大小的方法

本站推荐: 站长博客 网站导航 分类信息 发小妁交友 喜世界招商 分类导航 VIP电影

  yiluqufa

注册时间:

网站:1 个   小程序:3 个  文章:12 篇

  • 265

    网站

  • 19

    小程序

  • 4046

    文章

  • 166

    会员

赶快注册账号,推广您的网站吧!
热门网站
最新入驻小程序

北京实时公交出行2019-06-07

实时公交车线路查询小助手。公交

摩拜单车2019-06-07

扫码即可骑走的共享单车

人人车2019-06-03

人人车靠谱二手车

美团外卖2019-06-03

美团外卖,目前国内最大的外卖网上

京东购物2019-06-03

京东APP是一款多功能移动购物软

饿了么外卖服务2019-06-03

饿了就用饿了么!小程序版,更方便,微