div+css如何实现表格布局的框架网站?

发布网友 发布时间：2022-04-25 15:13

我来回答

共13个回答

热心网友 时间：2022-05-12 21:33

<div class="head>

    <div class="logo"></div>---------------------------------------------------(标志)

    <ul class="nav">-------------------------------------------------------------(导航)

            <li><a href="#"></a></li>

            <li><a href="#"></a></li>

            <li><a href="#"></a></li>

    </ul>

    <div></div>-------------------------------------------------------------------(当前位置和搜索条)

</div>————————————————————————————上面头部结束

<div class="main">

    <div class="left"> ——————————————————————主体内容左边       

            <li><a href="#"></a></li>

            <li><a href="#"></a></li>

            <li><a href="#"></a></li>

    </div>

    <div class="right"></div>———————————————————主体内容右边

</div>

<div class="footer"></div>———————————————————底部结束

一般是这样布局的，思路也很清晰，上中(左、右)下,不懂再问吧！

div+css其实是盒子原理，你要了解到每一对html标签就是一个盒子，然后你想要在这个盒子里放一些什么样的内容，这就根据页面来定了，

如图，盒子包括有外边距(margin)，这个可以这样理解就是两个盒子之间的距离这就叫外边距。

然后到边框(border)，这个就是一个盒子里面的内容和外面隔绝的一条边，比如说：电视机盒纸皮就是边框、房子墙就是边框、鱼缸玻璃就是边框。

再然后就是内边距（padding），内边距可以理解为边框与内容之间的距离叫内边距，比如说：电视机装在电视盒里面不可能是全部装满因为电视机的外形不是一个正规的长方形或是正规的正方形，所以电视机(内容)与纸皮(边框)之间空出来的距离就是内边距,或者在一个房子里桌子与墙的距离就是内边距，都可以这样理解。

最后就是内容了，内容包括什么呢？包括（文本、图片）就这么多！

热心网友 时间：2022-05-12 22:51

现在不用框架来设计网页了哇！

左边这块可以用列表<ul><li></li></ul>

右面主体 可以用
<div>

<span></span>转换为区块
<div>

<dl>
<dt></dt>
<dd></dd>

<dl>
<dl>
<dt></dt>
<dd></dd>
<dl>
</div>

</div>

最后浮动就可以了！

网页头部和导航很简单，就不多说了！

热心网友 时间：2022-05-13 00:26

你这个是，上 ，中（左 右），下 的分布
上边就是logo及菜单，
中间分为左和右，你可以先用div把大块布出来，上中下都弄好，高不定，然后慢慢给其它里面添加内容就好了。
这种网页算是最简单的。

热心网友 时间：2022-05-13 02:17

用最简单的方法…下载个整站下载器…把这个网站下载下来…在下载个html手册和css手册
慢慢研究去吧…在这里就算写上1000字也未必解释的清除

热心网友 时间：2022-05-13 04:25

<div class="top-menu">
<ul>
<li>导航内容</li>

</ul>

</div>

基本就跟列表形式，其他的根据所属定义

热心网友 时间：2022-05-13 06:50

那就需要用到JS特效了，选项卡特效，上网找找，很多的。。。希望能帮到你

热心网友 时间：2022-05-13 09:31

一样，在右面div里边嵌套框架就一样iframe
或者在一个页面里边实现 ，用js控制 css的 display属性

热心网友 时间：2022-05-13 12:29

不一定要用框架啊 只要左边不变右边变就行是不？ 绝对不乱说 有兴趣可以加Q446238262 讲解。

热心网友 时间：2022-05-13 15:44

右侧用框架，点击左侧，变换框架的src

热心网友 时间：2022-05-13 19:15

左边的用一个tab切换的js代码也很容易实现

热心网友 时间：2022-05-13 23:03

上导航不难，你用一个DIV+UL就可以搞定
比如:(里面的ul和li的宽高根据自己的需求设定一下就可以了)
<div style="width:980px; float:left;">
<ul>
<li>第一个</li>
<li>第一个</li>
</ul>
</div>
左导航就要结合JS了，这个自己不会写的话可以去收索下JS的成品，或是把别人的偷过来
右边内容看要不要和你的做导航一起了，不需要一起的话可用1个父DIV分成2个子DIV来作就可以

热心网友 时间：2022-05-14 03:08

可以用层啊

热心网友 时间：2022-05-14 07:29

用iframe框架就可以,详细看这里http://www.w3school.com.cn/html/html_iframe.asp