关于DIY区域问题求助

罗汉果 · 发表于 2014-11-8 08:16:40

本帖最后由罗汉果于 2014-11-12 02:23 编辑

老师好：
   我是零基础学习DISCUZ，看了朱老师的视频教程后，对我的帮助很大，在此对朱老师与起点网表示由衷感谢！
   看了第三章《实现华丽JQ轮播图》后，跟着动手学习，想添加门户页左右两个自定义DIY区域，代码如下：

   
<style id="diy_style" type="text/css">
      #diy2{width:70%;float:left;}
      #diy3{width:20%;float:right;}
</style>
<div class="wp">
      <div id="diy1" class="area"></div>
      <div id="diy2" class="area"></div>
      <div id="diy3" class="area"></div>
</div>

<script src="misc.php?mod=diyhelp&action=get&type=index&diy=yes&r={echo random(4)}" type="text/javascript"></script>


不知是何原因，出来的两个DIY区域不是70%和20%，希望老师能指点迷津。

                                             再次感谢！

技术帮助 · 发表于 2014-11-9 23:36:11

有审查网页查看div所在区域的大小吗？

审查元素

其实有一个很简单的方法，就是给DIV加上高度和背景颜色。
比如这样：

<style id="diy_style" type="text/css">
#diy1{width:10%;float:left;background:yellow;height:70px;}
#diy2{width:70%;float:left;background:red;height:70px;}
#diy3{width:20%;float:right;background:green;height:70px;}
.wp { width:960px;margin: 0 auto; }
</style>
<div class="wp">
<div id="diy1" class="area"></div>
<div id="diy2" class="area"></div>
<div id="diy3" class="area"></div>
</div>

复制代码

效果就是这样：

修改演示

罗汉果 · 发表于 2014-11-12 02:31:59

技术帮助发表于 2014-11-9 23:36
有审查网页查看div所在区域的大小吗？

感谢老师，问题圆满解决！
不但解决了DIY区域问题，原来DIY区域还可以设置颜色，感谢！

技术帮助 · 发表于 2014-11-12 02:51:04

解决了就好！

		自动登录	找回密码
密码			立即注册