html代码 想仿一个网页,但是遇到了一些问题 1 为什么文字不在div里,我在<li>中设置了float:left以后,

本来文字是在div里的,后来div背景就跑到上面去了(?)2 制作一个网页时,相对定位用得多可以么?3 网页整体缩小时,会有div里的内容冲破div怎么解决图1是预览效果 图2是代码 图3是css觉得幼稚可以不回答,但是请别讽刺题主。。谢谢大家~
图1可以看见文字上面有一条灰色的线,那个就是div背景在我在<li>设置浮动后就跑到上面去了。

1、
题主是想说 #top 的高度并没有被里面众多的 li 撑开是吧?

这就是 float 带来的浮动闭合问题,题主可以搜索一下 clearfix 这个关键词,它就是用来解决这种问题的。

2、
完全没问题。

3、
网页缩放这个其实可以不用管它,目前没有完美解决方案,一般都是用 overflow: hidden; 了事。追问

我用了clearfix以后第一个问题就解决了~
但是我的那个里面的第二个不在它的外层div里,而是跑出去
这是什么情况呢?这种情况我可以用相对定位再定位它吗?
^-^谢谢你的回答

追答

没懂题主说的意思,正确的 clearfix 方式(不只一种):

.clearfix {overflow: auto; _height: 1%;}

然后给 #top-font 增加一个 class="clearfix" 即可。

追问

就是这样,掉到下面了~我用的clearfix和你一样

追答

题主还做了其他改动或者引入了其他 CSS 吗?


加上这个样式试一下。

.nostyle1, .nostyle2 {display: inline;}

追问

我加了你说的样式以后又变成了这样,本来设置的nostyle2{margin-left:790px}的距离不见了,其他没有做什么改动和其他css   就加了clearfix和display

抱歉啊问题太多了,结题给你追加悬赏

追答

抱歉,打错了,是 inline-block,不是 inline。

追问

改了以后,下边距变大了,而且顺序也打乱了

追答

题主把你的完整代码传到网盘里吧,贴地址。

追问

链接: http://pan.baidu.com/s/1kVvwglT 密码: t9rg

温馨提示:内容为网友见解,仅供参考
第1个回答  2016-09-04

在最后一个li的后面加上

<div style="clear:both;"></div>

你这是明显的没有清浮动,先把浮动清了,才能解决之后的问题。
 

如何调整文字在div中的位置如何调整文字在div中的位置
如何控制文本在DIV中的位置 1。首先,打开hbuilder软件,创建一个新的html文件。在html中,设置三个P标签,并赋予它们不同的类属性。2.然后,在顶部的style标签中设置P标签的高度、宽度和背景色。在三个类的text-algin属性中,将第一个设置为left表示左对齐,将第二个设置为center表示居中,将第三个...

网页制作中如何设置标题中的文字是垂直居中
1、第一步,创建一个新的html文档,在body标签中添加一个div标签并填写一段文本,然后为该div设置一些样式,见下图,转到下面的步骤。2、第二步,执行完上面的操作之后,将“ text-align”属性添加到div,该属性值为“ center”,然后文本将在框架内水平居中,见下图,转到下面的步骤。3、第三步,...

网页编辑的问题,常常会遇见 在一个<div><\/div>中间加的<div>只要设置了...
这应该是 浮点层 脱离了文档流的关系,在一个div中 如果嵌入了一个浮点div 这个div因为是浮动在它的父级div上 因此就脱离了上个div的文档流 所以它会出现 不包围的情况 这需要对一个元素清理 clear属性 通常没有发现能清理的元素时 可以这么解决问题 例1:<div style="whith:1000px;"> <div id...

怎么设置文字在div中垂直居中,而不是用line-height来设置
如果是一段文字,父元素不限高,要垂直居中,可以采用padding:20px 0;如果是一段文字,父元素有固定的高,要垂直居中,可以采用 <div style="height:400px;position:relative;"> <div style="position:absolute;top:50%;"> <div style="position:relative;top:-50%;"> asdfsdfasdfsda<br \/>...

一个简单的html网页设计代码?
HTML是用来描述网页的一种语言。下面我为大家分享HTML代码,希望对大家学习html代码有帮助! 忽视右键 bodyoncontextmenu="returnfalse" 或 bodystyle="overflow-y:hidden" 1.如何几秒后转到别的页面? METAHTTP-EQUIV="Refresh"CONTENT="时间;URL=地址" 2.点击关闭窗口 ahref="javascript:top.window.close();"点击...

css里我在div中设置了li标签垂直居中为什么右侧设计版显示不居中?
你好,浏览器显示没问题就可以的。设计器只是个工具,不可能完全等同于浏览器的,兼容性要差一些的。

html怎么在li中间加隔开线
1、要设置隔开线可以使用border标签。打开Hbuilder编辑器,新建一个html空白文档,输入基本的结构,css样式里让li标签左浮动并加入简单的样式:2、在css里设置border-left的样式,然后需要使用“:first-chirld”伪类让第一个li标签的border消失:3、最后保存一下,在软件右侧的浏览器就可以观察到最终效果了...

我写了一个html网页,添加了<meta name="viewport"content="width=dev...
网页通常要透过网页浏览器来阅读。根据W3C对于WEB PAGE的定义,网页是一个信息的集合,其内容包含一个或多个网络资源的信息,同时预期使其成为单一个URI。进一步说,一个网页其包含一个或多个嵌入于网页中的网络资源使其成为单一个URI档案(HTML),而该URI并不再嵌入于其他档案之中。网页是构成网站的...

html 文字和图片在一个div
因为图片设置了float之后就脱离了文档流,可以理解为网页是一层一层重叠起来的,而现在图片和div不在一个层级了,所以div就覆盖了图片。只需要在div上也加上float,让div和图片在同一层上,就ok了。

如何用html编写一个简单的网页
代码如下:<html> <body> 最简单的网页 <\/body> <\/html> 4、保存并关闭txt文本,然后修改我们txt文本的扩展名为html,此时会弹出警告框,提示我们修改后可能会导致文件不能使用,这是操作系统的一个处理逻辑,为了防止无意或恶意的损坏文件的行为。5、无需担心,因为这在我们自己的掌控之下,确认警告...

相似回答