如何通过css的media属性，适配不同分辨率的终端设备，示例如下: 首页 @media (max-width:768px) { #div1 { width: 400px; margin: 0 auto; background:url('../img/1.JPG'); } #img2,#img3 { width: 100px; } } @media (min-width:768px) { #div1 { width: 600px; margin: 0 auto; background:url('../img/1.JPG'); } #img2,#img3 { width: 200px; } } @media (min-width:992px) { #div1 { width: 800...
图片总是上传不成功，简单的说就是左右两列div，请教如何让这两个div的高度自适应当前屏幕的分辨率，自动撑满屏幕？谢谢！ 回复讨论(解决方案) *{padding:0;margin:0;}.container{height:100%}html,body{height:100%;width:100%}.l{width:20%;background:#333;float:left;height:100%;}.r{width:80%;background:#666;float:right;height:100%;} dfsf rrr height:100%;
我的笔记本是15.6英寸的，我开发的网页在我的电脑上看起来比较好，但是我想换一个大的屏幕的话，应该有很多元素会错位。请问各位是怎样解决这个问题的呢？我觉得通过绝对布局，相对布局和宽度等采用百分比都有瑕疵，对不同的分辨率都错错位，请问各位做网页的时候是怎么做的呢？是采用什么样的方式来解决不同的分辨率的问题呢？ 回复讨论(解决方案) 响应式...
图片红色长方形表示浏览器显示的部分， 图片一共三排（每排div都是通过第一个div进行浮动，第二排和第三排调了外边距）div组成， 我想在不同分辨率荧幕下的显示效果相同，请问该怎么实现，小白实在不懂，搞了一下午也没头绪，希望大家帮帮忙。 回复讨论(解决方案) 宽高可以设置为百分比的值，如width;100%; 这个百分比是按照屏幕大小算的，百分之百就是...
我做的网页感觉在不同屏幕分辨率下显示效果不同，现在又什么好的办法解决这个问题没，能让网页自适应屏幕分辨率 并且布局保持不变 不管多大屏幕显示的是整个页面的放大或缩小之后的布局 回复讨论(解决方案) width：100%； $(window).bind(resize load, function(){$("body").css("zoom", $(window).width() / 640);$("body").css("display" , "block");}); ...
1、简介 calc()看其外表像个函数。平时在制作页面的时候，总会碰到有的元素是100%的宽度（例如body元素）。如果元素宽度为100%时，其自身不带其他盒模型属性设置还好，要是有别的，那将导致盒子撑破。比如说，有一个边框，或者说有margin和padding，这些都会让你的盒子撑破。我们换句话来说，如果你的元素宽度是100%时，只要你在元素中添加了border,padding,margin任何一值，都将会把元素盒子撑破（标准模式下，除IE怪异模式...
只能针对不同分辨率写不同的样式吗 有没有什么九阳神功之类的强大的解决方案加个属性就O听那种 回复讨论(解决方案) 用css的media query，不同分辨率另外整一套样式 http://www.cnblogs.com/asqq/archive/2012/04/13/2445912.html
本帖最后由 yy86965921yy 于 2013-03-15 11:50:55 编辑 .head { height: 153px; margin: 0 auto; width: 990px; } .headwai { background:#000; height: 153px; margin-left: -465px; overflow: hidden; position: absolute; width: 1920px; } .head .butong { height: 153px; width: 950px; } .head .head_li { height: 153px; marg...
资料 /* FFS SSS GGG CCC NNN AAA BBB CCC DDD EEE FFF GGG SSS VVV ...
/* 随窗口浮动层 */.service{position:absolute; width:100%; height:150px;}.service .div{position:relative; width:770px; margin:0 auto; height:172px;}.service .ser{position:absolute; padding:2px; width:92px; height:177px; border:2px solid #1A4E88; background:#fff; left:784px; top:133px;}.service .wel{width:92px; height:23px; background:#1F5FA5; color:#fff; text-align:center; line-height:23px; font-si...
body {width:1257px;margin:auto;} #head{width:1257px;height:102px;background:url(./images/guagua_01.jpg) no-repeat;} #menu{width:1257px;height:38px;background:url(./images/banner.jpg) repeat-x;} #soso{width:1257px;height:40px;background:url(./images/soso2.jpg) repeat-x;} #banner{width:960px;height:92px; margin:auto;} body大于1200px 显示器打开默认居左，要用什么元素才能居...
无标题文档 *{ margin: 0; padding: 0;}body{ -webkit-user-select: none; -webkit-user-drag: none; -webkit-text-size-adjust: 100%;}a{ text-decoration: none;}a,input,button,textarea,fieldset,ul,span{ -webkit-tap-highlight-color: rgba(255,255,255,0);}input[type='text'] ,textarea ,fieldset{ border: none; outline: none;}body,h1,h2,h3,h4,h5,h6,p,form,ul,ol,li,dt,dl,dd,th,td,label,bottom,input,textarea{ ...
当我变窄的时候，下方就有空白了。我想让他无论变窄还是怎样都能保持充满整个页面。该怎么调整，贴代码上来给各位大牛指点一下。 body{ font-family: "Microsoft Yahei","微软雅黑",Arial,sans-serif; height: 100%; width: 100%; background-image:url("../Photo/web_wechat_login_bg28a2f7.jpg"); background-size:cover; background-repeat: no-repeat;} 回复讨论(解决方案...
随着时代的发展，移动设备越来越多，原来前端工程师要给一个页面写两套代码，一个用于PC端，一个用于移动端，但是现在只要写一套代码就够了，因为我们可以使用媒体查询，即@media这个方法，接下来就给大家介绍几个媒体查询@media实现自适应的关键分辨率，有需要的朋友可以参考一下。经常为不同分辨率设备或不同窗口大小下布局错位而头疼,可以利用@media screen实现网页布局的自适应,但是怎样兼容所有主流设备就成了问题。到底分辨率...
这次给大家带来css的绝对定位怎么兼容所有的分辨率，css绝对定位兼容所有分辨率的注意事项有哪些，下面就是实战案例，一起来看一下。有时候我们在写页面中，会发现绝对定位的父级元素已经相对定位了，但是在不同分辨率的电脑下，绝对定位还是会错乱，似乎父级的相对定位并没有起了作用。首先要明白如下几个原理：1、笔记本电脑的分辨率一般为1366*768附近，PC电脑的分辨率一般为 1920*1080；以下为常见电脑分辨率：当写网页时，如果...