浏览器的字体重叠了怎么办?

浏览器的字体重叠了怎么办?,第1张

打开网页字体重叠的解决方法(以360极速浏览器为例):

以下图为例:”我要提问“和”我的帐号“字体重叠了。

点浏览器底部右下角的”缩放“图标,然后鼠标点滑块向左移动,并且勾选”缩放比例对所有页面生效“。

效果如下:

我们常常在做网页的时候发现一个问题,那就是DIV覆盖了DIV,这样就出现了DIV的盒子重叠覆盖导致内容没有出现这么一个问题,那么我们今天就来给大家介绍一下产生原因以及解决方法。

可能您遇到过上下结构的布局,下面DIV内容重叠上面DIV内容上,也可能下面内容覆盖掉上面DIV布局,形成DIV与DIV覆盖重叠现象;您也可能遇到过相邻的两个DIV盒子发生重叠覆盖现象,这些是什么问题如何解决?

接下来通过案例来演示这两种兼容性DIV覆盖重叠现象问题,并解释原因与解决方法。

上下结构DIV盒子覆盖 首先实例HTML代码

<!DOCTYPE html>

<html>

<head>

<title>DIV与DIV覆盖</title>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<style>

boxa,boxb{ margin:0 auto; width:400px;}

boxa-l{ float:left; width:280px; height:80px; border:1px solid #F00}

boxa-r{ float:right; width:100px; height:80px; border:1px solid #F00}

boxb{ border:1px solid #000; height:40px; background:#999}

</style>

</head>

<body>

<div class="boxa">

<div class="boxa-l">内容左</div>

<div class="boxa-r">内容右</div>

</div>

<div class="boxb">boxb盒子里的内容</div>

</body>

</html>可拷贝代码自己动手发现DIV覆盖现象。

实例代码说明:

设置两个大div盒子分别CSS命名为“boxa”和“boxb”,设置宽度相同均为400px,对“boxb”设置一个黑色边框与高为40px、背景为黑色的;然后在boxa里添加两个一个靠左一个靠右CSS命名分别为“boxa-l”“boxa-r”,两个小盒子,同时设置红色边框、css高为80px、宽度分别为280px和100px。

问题分析

一般想需要将“boxa”和“boxb”布局是上下结构,从上图发现在浏览器中看到效果是两个盒子里内容是实现上下结构效果,但“boxb”这个DIV跑到“boxa”下面去了,但内容没有发生覆盖,只有DIV发生覆盖现象。

这个原因是因为第一个大盒子里的子级使用了浮动float属性而产生了浮动,所以导致“boxa”没有被撑开,而同级的“boxb”盒子与“boxa”紧贴,而“boxa”高度没有,“boxa”的子级浮动的与“boxb”不是同级,“boxb”盒子依然认为“boxa”没有高度,所以导致“boxb”DIV盒子就跑到“boxa”子级DIV盒子下面形成了覆盖重叠现象。

问题解决方法

要么清除浮动,要么设置“boxa”高度,一般情况下文字内容不确定多少 就不能设置固定的高度,所以一般不能设置“boxa”高度(当然能确定内容多高,这种情况下“boxa”是可以设置一个高度即可解决覆盖问题。)。

这里就使用CSS清除浮动方法解决上下结构DIV重叠覆盖问题,清除浮动有两种方法,方法如下。

css clear清除浮动

在“boxa”盒子</div>闭合前加clear样式清除浮动。

完整HTML源代码:

<!DOCTYPE html>

<html>

<head>

<title>DIV与DIV覆盖</title>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<style>

boxa,boxb{ margin:0 auto; width:400px;}

boxa-l{ float:left; width:280px; height:80px; border:1px solid #F00}

boxa-r{ float:right; width:100px; height:80px; border:1px solid #F00}

boxb{ border:1px solid #000; height:40px; background:#999}

clear{ clear:both}

</style>

</head>

<body>

<div class="boxa">

<div class="boxa-l">内容左</div>

<div class="boxa-r">内容右</div>

<div class="clear"></div>

</div>

<div class="boxb">boxb盒子里的内容</div>

</body>

</html>此方法与上一方法更为简便简单,只需对“boxa”(子级有浮动的父级盒子加overflow:hidden)

CSS DIV实例代码如下:

<!DOCTYPE html>

<html>

<head>

<title>DIV与DIV覆盖</title>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<style>

boxa{ overflow:hidden}

boxa,boxb{ margin:0 auto; width:400px;}

boxa-l{ float:left; width:280px; height:80px; border:1px solid #F00}

boxa-r{ float:right; width:100px; height:80px; border:1px solid #F00}

boxb{ border:1px solid #000; height:40px; background:#999}

</style>

</head>

<body>

<div class="boxa">

<div class="boxa-l">内容左</div>

<div class="boxa-r">内容右</div>

</div>

<div class="boxb">boxb盒子里的内容</div>

</body>

</html>解决DIV覆盖的问题就这样给大家解决了。更多精彩请关注Gxl网其它相关文章!

相关阅读:

CSS里怎么使用border-radius

HTML的表格样式

html的编辑转换器

你可以分两个步骤来解决!

单击开始,指向程序,指向附件,再指向辅助工具,然后单击辅助功能向导。

单击下一步,然后再次单击下一步。

单击选中“禁用个性化菜单”复选框。

连续单击下一步、下一步、下一步、下一步,然后单击完成。 首先

IE右键-属性-辅助功能-取消所有的对号

如果问题还不能够解决的话请打开开始菜单——控制面板-辅助功能选项--显示-“使用高对比度”

前面的钩去掉!~ 重新启动IE,如果还不行 重新启动一下 希望对您有所帮助!~

欢迎分享,转载请注明来源:品搜搜测评网

原文地址:https://pinsoso.cn/shuma/759000.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2023-08-05
下一篇2023-08-05

随机推荐

  • 夏天涂防晒霜的正确步骤

    夏天涂防晒霜的正确步骤你知道夏天涂防晒霜的正确步骤是什么样的吗?很多女生刚开始学化妆,还不知道防晒霜应该在什么时候涂。我精心为大家整理了夏天涂防晒霜的正确步骤相关的知识和信息,希望对你有所帮助。

    2024-04-15
    56700
  • 国产护肤品谷雨真的好用吗?,,

    挺好用的。水看起来里面有水珠,上手试了一下,出来的液体并没有我想象的黏,因为大家说很油腻很稠,我以为会是那种啫喱感,但是并没有,自我感觉很清爽不油腻,涂开之后完全就是水,很快就吸收了味道呢,刚打开瓶盖是那种植物的清香,还有点像芦荟的味道,但

    2024-04-15
    57200
  • 伊思好还是高丽雅娜好

    1、价格还很白菜,是平价里用过最好的BB霜。高丽雅娜BB霜这个BB霜还是好闺蜜送给我的,她个人认为很好用,强推我试试。我用了一半了,觉得提亮美白作用很明显,遮瑕也还行,后续还是要上一些遮瑕膏的,不油腻,上妆很服帖,特别滋润。2、来了韩国就会

    2024-04-15
    57700
  • 妮维雅630为什么放那么多香精

    妮维雅630因为化妆品一般成分是化学物质不加香精不好闻。根据查询详细资料显示,妮维雅630淡斑焕白精华液揉开淡淡的香味,有人觉得味道不够高级,但是效果是很好的,油皮擦毫无压力,还有高渗透小分子玻尿酸帮助630更快的深入肌底,放大抑黑效果,想

    2024-04-15
    45600
  • 妮维雅身体乳能美白么,妮维雅美白身体乳真的能美白吗

    俗话说“一白遮三丑”,这句话的意思就是白皙的皮肤可以遮盖人脸部上的很多缺点,这也会许多女孩子渴望美白肌肤的原因。改善肤色的办法有很多,大部分女生会选择涂抹具有美白功效的的护肤产品。现如今市面上的美白护肤产品越来越多,其中妮维雅的美白身体乳就

    2024-04-15
    49400
  • 龙婆烈帕婴能不能和其它帕婴一起供

    不可以。怕烫和帕婴依霸古曼一起供奉基本是不可以的,建议不要供奉在一起,怕烫是音译,基本就是一种大鬼的东西,依霸又是招人缘,异性缘的阴牌,拍婴也是有正牌有阴,古曼童是经过净化的夭折小孩子的灵体,跟多时候是指正的古曼,而不是一些巫师制作的。

    2024-04-15
    41500
  • 厦门特色小吃有哪些?

    正宗的厦门特色小吃土笋冻、海蛎饼、沙茶面、台湾大肠包小肠、鸡排、冰品等。沙茶面一直是赫赫有名的,在外人的口碑中乌糖沙茶面的名气最高,虽然土著说本地人也知道,但是土著说,要说老牌美味,还是四里沙茶面才是真爱。位于厦门湖滨的四里菜市场的四里沙茶

    2024-04-15
    40400

发表评论

登录后才能评论
保存