css布局东西乱跑的解决方法

最新推荐文章于 2022-09-20 12:03:46 发布
最新推荐文章于 2022-09-20 12:03:46 发布
阅读量1k 收藏 1
点赞数
文章标签： css table float div
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/ben870418/article/details/2784628
版权

    刚开始用css布局做一个网站就很衰的发现分辨率变低或者窗口没有最大化的时候页面元素会到处乱跑。实在不想重新用table来做了，页面有点复杂，冥思苦想很久终于发现了一个灰常简单的办法，就是

     把整个网页，从body开始到body结束，用一个大号table包起来，浙table只有一个表格，这样的话无论用户怎样改变浏览窗口的大小，里面的float元素都不会四处飞来飞去了==，所以各位有css div强迫症的的同胞们作网页记得至少用一个table把网页包住阿。可能有css高手有其他正规办法解决这种问题吧，有人知道的话请告诉我啊~

ben870418
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
css2D、3D详解
weixin_69474694的博客
07-15 517
css2D、3D详解
CSS网页布局中的最小高度问题的解决方法
12-29
假定有二个BOX，我们需要它的最小高度为150PX。 CSS 复制代码代码如下: div.box1,div.box2{ width: 300px; min-height: 150px; background: #EEE; float: left; margin-right: 20px; } xhtml <div class=box1>IE中没保持最小高度为150px</div> <div class=:box2>;最小高度可以设定一个BOX的最小高度， 当其内容较少时时，也能保持BOX的高度为一定 最小高度可以设定一个BOX的最小高度， 当其内容较少时时，也能保持BOX的高度为一定<
css布局实例:网页布局的方法
12-09
许多网页设计师都喜欢，将两个或者多个容器等高的并排放置，并在里面展示每个容器的内容，就象经典表格布局中的单元格控制几个栏目的位置，也喜欢容器的内容居中或顶部对齐显示。 　　但是你又不喜欢用table来实现他，那怎么办呢？实现的方法很多，有根据视觉错觉实现的，有用JS控制使高度相等的，还有采用容器溢出部分隐藏和列的负底边界和正的内补丁相结合的方法来解决列高度相同的问题。 　　其实有个简单的方法，使用display:table, display:table-row and display:table-cell 就可以实现，而且高度小的容器会自适应那些高度相对较高的，但是IE不支持这个属性，我们先不
CSS布局解决方案（终结版）
02-25
前端布局非常重要的一环就是页面框架的搭建，也是最基础的一环。在页面框架的搭建之中，又有居中布局、多列布局以及全局布局，今天我们就来总结总结前端干货中的CSS布局。（1）原理、用法原理：先将子框由块级元素改变为行内块元素，再通过设置行内块元素居中以达到水平居中。用法：对子框设置display:inline-block，对父框设置text-align:center。（3）优缺点优点：兼容性好，甚至可以兼容ie6、ie7缺点：child里的文字也会水平居中，可以在.child添加text-align:left;还原（1）原理、用法原理：先将子框设置为块级表格来显示（类似），再设置子框居中以达到水平居
学CSS网页布局排查错误的方法
12-01
虽然浏览器可能存在着很多Bug，但是并不是与自己感觉不一样的时候就是出现了Bug。产生问题的原因可能有很多种，因此制作者需要一定的方法来排查问题。 虽然浏览器可能存在着很多Bug，但是并不是与自己感觉不一样的时候就是出现了Bug。产生问题的原因可能有很多种，因此制作者需要一定的方法来排查问题。 选择一个先进的浏览器进行测试是明智的做法，例如对CSS 2.1支持比较好的Opera 9.2、Firefox 2.0或者Safari 3.0，而不要使用IE 6作为唯一的测试浏览器，因为IE 6的问题是最多的，这非常不利于制作者（特别是初学者）理解CSS 2.1的规范与判断浏览器的表现是否正确。 如果在
为什么css设计布局会乱,css多行布局错乱
weixin_32836713的博客
08-04 372
原图：自己实现的图：存在问题：那个“进入”按钮无法向原图那样排序，要是使用position相对位置的话，就会在不同的尺寸下乱跑。自己的实现代码： 怪兽必须死热门推荐精品保卫家园，人在城在！css代码：.row .image {float: left;width:50px;height:50px;margin-right:10px}.row .title {}.title .g...
页面百分比布局时缩小窗口,页面混乱
weixin_30657999的博客
02-02 477
在网上找了好久才找到.分享给大家. DIV+CSS 布局一行两列,左列固定宽度,右列自适应宽度;设置最小宽度,窗口小的时候显示滚动条. DIV+CSS 布局一行两列,左列固定宽度,右列自适应宽度;设置最小宽度,窗口小的时候显示滚动条;Firefox IE测试通过.辛苦几天的结果啊平行共三行,中间行分两列,左边固定宽度,右边自适应,并且对行宽度设置了最小值,如果窗口小到最小值以下将出现滚...
css常用样式，导致页面css样式混乱的原因，css遇到的问题，我和小伙伴们惊呆了
A__1Pink的博客
03-17 1765
css常用技巧 实现组件的自动换行排布： flex-wrap: wrap; 使列表排成一行 方法一：div{display:inline-block;} 方法二：div{float:left;} 方法三：flex布局。{display:flex; flex-direction:row;} 超出部分显示省略号 //单行 text-overflow ellipsis省略号点...
在css中插入轮播图，结果显示图片到处乱跑，不在一个框子内
2023年最新地推相关信息
03-19 390
轮播图显示图片到处乱跑，不在一个框子内，这个该怎么办，想让它在页面左边。
css 子级元素设置margin-top父级元素会跟着移动问题解决
weixin_67375532的博客
06-19 2859
关于嵌套盒子时css 子级元素设置margin-top父级元素会跟着移动的问题原因以及解决办法
CSS 控制table 滑动及调整列宽等问题总结
weixin_30443075的博客
02-07 615
一. 通过css控制table y方向上滚动 html中没有滚动条，可以根据overflow属性的scroll来对table显示不完全的内容进行滚动. 只是y方向上滚动，很简单,只要设置div的height高度。然后设置overflow-y:scroll。这样当内容高度超过了height设定的高度，就会出现滚动条 css: .scroll_y{ max-height: 200px...
css 网页自适应方案 大屏自适应方案
热门推荐
海胆的博客
09-20 1万+
rem的方案对于1920及以上分辨率屏幕来说基本适用，但当切换到1366*768等小分辨率时，由于浏览器默认。写死的，也会出现超出画布的问题，因此衍生第二种方案： scale缩放。css 相对单位，相对于根元素的 font-size 值的大小。将设计到的单位转化为rem单位就可以实现等比例的自适应缩放。，所以会导致文字比理想效果更大， 而echarts生成的。直接计算每个像素在设计稿中占据的%来输出vw，rem。比例不对的情况下，画面可能会被压缩。一些图表的自适应方式需要特别处理。DataV 数据大屏。
内容不随滚动条移动css,css div不随滚动条移动的实现方法
weixin_35826493的博客
08-03 2739
css div不随滚动条移动的实现方法：首先创建一个示例文件；然后通过给div设置css属性样式为“position:fixed;”即可固定div不随滚动条移动。本教程操作环境：Windows7系统、HTML5&&CSS3版本，Dell G3电脑，该方法适用于所有品牌电脑。css设置div不随滚动条移动把一个内容固定到某一个位置 ，相对与浏览器窗口进行定位就可以了。这里使用的是fi...
css transform:scale缩放后位置偏移问题解决
sunzhen15896的博客
09-01 9204
css相关问题
html网页缩小之后div框移动,css – DIV在浏览器中放大和缩小时移动
weixin_29480231的博客
06-19 371
我有一个以下的div结构/* html goes here */现在当我从浏览器放大或缩小时,“storeFinder”向右/向左移动……我在网上搜索过,发现需要一个围绕“storeFinder”的包装器,这样它就不会随着< body>而移动.并指定最小宽度也可以解决问题.在我的情况下,我已经有一个包装div和指定min-width也dint帮助我.在这里寻求帮助非常糟糕.#wrap...
css解决文字抖动问题
SiShen654的博客
07-10 2326
当点击选中时，文字会发生跳动问题坍台，原因是使用了CSS3动画导致高度坍塌计算不准，解决如下： 在使用CSS3变化属性，可能涉及该元素3d的变化，而3d又有正反面之分，导致计算高度时，高度在不断变化，才会产生抖动效果。 下面属性含义：当元素背面朝向观察者时是否可见。将其设置为隐藏，可将不断变化的高度不显示出来。 backface-visibility: hidden; // 兼容写法 -webkit-backface-visibility: hidden; 父属性：使用了transform变形
css遇到的坑：一行文字内容没有填满，就跑去下一行去了。看着很不舒服。怎么办？
一键写代码的博客
04-25 6976
问题的问题 在我的外层div设置pading值，或是pading-right值后，内部的文字内容换行样式看起来很奇葩。 类似这样的，一行文字内容没有填满，就自动换行了。 解决办法1：padding-right的值捣鬼。 外壳的div属性，不要设置pading-right的值，或是设置为0就可以了。 这个办法不是很好，不推荐。不喜欢，不舒服，不爽啊。 解决办法2：word-break: break-...
初学者css页面布局2种容易发生的错误而导致页面混乱的原因
王帅鸣的博客
10-04 726
float浮动 发生情况：当给子元素设置浮动时，父元素没有具体高度,就会造成父元素高度的塌陷。父元素宽度不变，而高度为0。 检查方法 浏览器f12调试检查父元素 解决方法： ①给父元素设置overflow：hidden；溢出隐藏 ②给父元素设置高度 ③使用伪元素，清除左右浮动 外边距击穿问题 外边距击穿常常出现于大盒子中嵌套小盒子，设置内层小盒子的外边距时，大盒子也会出现同样的效果。 外边距击穿的产生原因：相邻的两个盒子元素会共用一个外边距 相邻的定义：同级或嵌套的盒子元素他们中间没有内容（非空） 解
css 文字弹性布局会乱
最新发布
05-19
解决这个问题的方法是： 1. 确保容器的宽度能够容纳所有文本内容。 2. 设置合适的行高，以保证文字能够正确地垂直居中。 3. 如果容器宽度不足以容纳所有文本内容，可以考虑使用 CSS 的 white-space 属性来调整...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值