仓酷云

 找回密码
 立即注册
搜索
热搜: 活动 交友 discuz
查看: 743|回复: 9
打印 上一主题 下一主题

[DIV+CSS] 给大家带来CSS教程:实习层DIV的定位小实例

[复制链接]
简单生活 该用户已被删除
跳转到指定楼层
楼主
发表于 2015-1-16 00:07:33 | 只看该作者 回帖奖励 |倒序浏览 |阅读模式

马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
一般来说还需要用Photoshop或FireWorks(以下简称PS或FW)等图片处理软件将需要制作的界面布局简单的构画出来。
层的定位是良多人对照困扰的成绩,点击弹出层会跟着分辩率的改动层的地位也变化。

用实践截图来形貌成绩征象:


那末如何让层流动在一个地位,不论分辩率或窗口改动而变更呢?这就是我所要纪录的层的定位成绩:
创建一个父级div,不改动x、y,然后在这个父级div内里包括一个子级div,在这个子级div里任意改动它的地位(设置top和left值)。

实例论述:

<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=gb2312"/>
<title>关于层的定位</title>
</head>
<body>
<divstyle="width:800px;margin:0auto;background:#FFFFCC;overflow:auto;font-size:12px">
<divstyle="margin:100px0100px100px"><ahref="#">更多乡村>></a></div>
<divstyle="position:relative;width:0;height:0">
<divstyle="position:absolute;top:-95px;left:130px;width:200px;background:#DDDDDD">北京上海广州</div>
</div>
</div>
</body>
</html>

预览截图:


表现和结构分离,在团队开发中更容易分工合作而减少相互关联性
因胸联盟 该用户已被删除
沙发
发表于 2015-1-18 05:15:39 | 只看该作者
经过两天的学习,总算对Dreamweaver有进一步的了解了,心中不免有些激动。今天和其他几位老师交流了一下,感觉受益匪浅.
小女巫 该用户已被删除
板凳
发表于 2015-1-18 05:15:39 | 只看该作者
运动)时间轴面板--拖动关键帧--单击整条--将鼠标移至中间一点--右击选择增加关键帧--移动中间关键帧的图层--勾选自动播放,循环
精灵巫婆 该用户已被删除
地板
发表于 2015-1-25 14:07:19 | 只看该作者
滚动条)层属性--溢出(visible/hidden/scroll/auto)
简单生活 该用户已被删除
5#
 楼主| 发表于 2015-2-2 22:30:02 | 只看该作者
还是在Dreamweaver所见即所得添加链接是,可以选中文字或图片然后按下shift键不放鼠标拖出箭头直接指向文件即可。这是比较简单的也是常用的方之一。
海妖 该用户已被删除
6#
发表于 2015-2-8 17:13:38 | 只看该作者
Dreamweaver在所见即所得添加链接,也可以先选中文字或图片然后在属性栏中的链接栏后的一个小圆圈,用鼠标点击小圆圈按住不放拖动出箭头然后指向文件即可。
灵魂腐蚀 该用户已被删除
7#
发表于 2015-2-25 21:55:22 | 只看该作者
足见市场的反响和MACROMEDIA公司对它们的自信。说到Dreamweaver8我们应该了解一下网页编辑器的发展过程,随着互联网(Internet) 的家喻户晓。
山那边是海 该用户已被删除
8#
发表于 2015-3-8 08:40:13 | 只看该作者
在Dreamweaver里可以很轻松的完成图文混排、插入图片、插入Flash、插入音频、插入视频。
admin 该用户已被删除
9#
发表于 2015-3-15 22:33:08 | 只看该作者
我深感到交流的重要。善于交流的人才是善于学习的人。在整个技术的学习过程中,我总结了四大定律:兴趣、恒心、虚心、时间。
蒙在股里 该用户已被删除
10#
发表于 2015-3-22 17:31:20 | 只看该作者
dreamweaver8中文版下载(dw)对专业网页图像设计的FIREWORKS,三者被MACROMEDIA公司称为DREAMTEAM(梦之队)。
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|Archiver|手机版|仓酷云 鄂ICP备14007578号-2

GMT+8, 2024-12-23 03:58

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表