- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我在调整浏览器大小时移动部分 html 时遇到问题。我在这里尝试了所有解决方案,但似乎没有任何效果。我对此很陌生,所以也许做错了。任何指导将不胜感激!
这是我的代码 html 和 css
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>PUMPED|Building Your Best You</title>
<link href="master.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
</script>
</head>
<body onload="MM_preloadImages('images/home3_over.png','images/home8_over.png','images/home12_over.png')">
<div id="home1"></div>
<div id="home2"></div>
<div id="home3"> <a href="http://gum.co/Pumped" target="_blank"><img src="images/home3.png" width="262" height="63" id="Image1" onmouseover="MM_swapImage('Image1','','images/home3_over.png',1)" onmouseout="MM_swapImgRestore()" /></a></div>
<div id="home4"></div>
<div id="home5"></div>
<div id="home6"></div>
<div id="house7"> <a href="https://gumroad.com/l/Pumped" target="_blank"><img src="images/home7.png" width="202" height="64" id="Image2" onmouseover="MM_swapImage('Image2','','images/home8_over.png',1)" onmouseout="MM_swapImgRestore()" /></a></div>
<div id="home8"></div>
<div id="home9"></div>
<div id="home10"></div>
<div id="home11"> <a href="https://gumroad.com/l/Pumped" target="_blank"><img src="images/home11.png" width="262" height="64" id="Image3" onmouseover="MM_swapImage('Image3','','images/home12_over.png',1)" onmouseout="MM_swapImgRestore()" /></a></div>
<div id="home12"></div>
<div id="home13"></div>
<div id="container">
</div>
</body>
</html>
CSS
@charset "UTF-8";
#container {
float: left;
height: 500px;
width: 1360;
margin-right: auto;
margin-left: auto;
}
#wrapper {
margin-left: auto;
margin-right: auto;
min-width:960px;
}
#home1 {
background-image: url(images/home1.png);
margin: 0px;
padding: 0px;
float: left;
height: 420px;
width: 1360px;
}
#home2 {
background-image: url(images/home2.png);
margin: 0px;
padding: 0px;
float: left;
height: 63px;
width: 548px;
}
#home3 {
background-image: url(images/home3.png);
margin: 0px;
padding: 0px;
float: left;
height: 63px;
width: 262px;
}
#home4 {
background-image: url(images/home4.png);
margin: 0px;
padding: 0px;
float: left;
height: 63px;
width: 550px;
}
#home5 {
background-image: url(images/home5.png);
margin: 0px;
padding: 0px;
float: left;
height: 492px;
width: 1360px;
}
#home6 {
background-image: url(images/home6.png);
margin: 0px;
padding: 0px;
float: left;
height: 64px;
width: 560px;
}
#house7 {
background-image: url(images/home7.png);
margin: 0px;
padding: 0px;
float: left;
height: 64px;
width: 202px;
}
#home8 {
background-image: url(images/home8.png);
margin: 0px;
padding: 0px;
float: left;
height: 64px;
width: 598px;
}
#home9 {
background-image: url(images/home9.png);
margin: 0px;
padding: 0px;
float: left;
height: 1549px;
width: 1360px;
}
#home10 {
background-image: url(images/home10.png);
margin: 0px;
padding: 0px;
float: none;
height: 64px;
width: 860px;
}
#home11 {
background-image: url(images/home11.png);
margin: 0px;
padding: 0px;
float: left;
height: 64px;
width: 262px;
}
#home12 {
background-image: url(images/home12.png);
margin: 0px;
padding: 0px;
float: left;
height: 64px;
width: 238px;
}
#home13 {
background-image: url(images/home13.png);
margin: 0px;
padding: 0px;
float: left;
height: 128px;
width: 1360px;
}
最佳答案
是的,这会发生,因为你的 css 仅适用于默认浏览器 View ,但当你调整大小时它不会很好。u cn 要么在谷歌上搜索“用于自动检测 UA 的脚本”。然后你必须做出不同的 - 2不同屏幕尺寸的 CSS。
关于调整浏览器大小时html移动,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19651488/
我的“登录”是在 IE 浏览器中进行的,登录后,如果我单击链接,它们就会在 Chrome 浏览器中打开。如何在同一个测试用例中将我当前的浏览器从 IE 切换到 Chrome。如果我创建一个 chrom
您好,我不明白在 Firefox 的内容属性中使用的特殊字符的不同显示行为。我已经剥离了一切并创造了一支笔: http://codepen.io/rpkoller/pen/Fbgav 在其“基本形式”
我正在研究 Spring Data REST,特别是 HAL 浏览器。我一直在关注 http://docs.spring.io/spring-data/rest/docs/current/refere
我正在使用工具提示,在 ie 上出现定位错误。我放了jquery浏览器代码 我的工具提示 $('.tooltip').tooltip({ position: "bottom center"
我应该如何处理蓝鸟协程中的错误? 我使用co in节点已有一段时间,它具有出色的捕获功能。 co(function*() { return new Promise(function(resol
package webviewbrowser; import java.util.List; import javafx.application.Application; import javafx.
我有一些 JavaScript 在同一域上的两个独立服务器之间共享请求。 .com 是 JavaScript 中域的要求吗? 在这种情况下,两台服务器都位于 .abc.tyy 域上,tyy 通常是 .
package webviewbrowser; import java.util.List; import javafx.application.Application; import javafx.
我正在尝试构建仍支持 NPAPI 的先前版本的 Chromium 浏览器。我已经获得了代码,并且可以使用 stand build 命令在我的 mac 上构建最新版本的 Chromium gclient
我环顾四周,找不到 browscap 的 Python 等效项(我在 PHP 中使用它来检测给定的用户代理字符串是什么浏览器。 我希望我不必自己写......:P 最佳答案 看看这个,它应该做你想要的
是否有任何 chrome 或 firefox 扩展允许 javascript 在客户端 PC 中创建写入文件? 最佳答案 你想做什么? HTML5 有一个 File API .这是最好的解决方案,因为
当我点击链接或刷新或关闭标签页时,我有这段代码会发出警报。 但我需要在关闭 窗口(选项卡)上仅 发出警报。怎么做? 我的网站上有很多外部和内部链接。
我目前正在尝试使用 Browserify + Angular,但我遇到了一个奇怪的问题。我在我的 Controller 的子目录中创建了一个名为 controllers/start-controlle
我正在为客户(项目已被接受,但现在是解释不同功能的问题)写一份详细的估算,以开发一个响应式布局的网站。 这不是我第一次进行此类开发,但这是一个关键客户,必须铺平道路。 布局将从 300px 宽度调整到
我在时事通讯上设计了一些黑底白字。由于时事通讯在打印时看起来不错且可读。我需要使布局和文本与浏览器中的内容相似。 通常情况下,黑色文本和无背景颜色是浏览器/网络邮件客户端的默认打印样式吗? 最佳答案
我有一个使用 GWT/mGWT 构建的移动友好网络应用程序。该应用程序有白色输入文本框和深灰色输入文本。但是,在 Android 浏览器上,文本显示为白色,因此是不可见的。我尝试的所有 CSS 都无法
我创建了一个带有选择输入的页面来更改正在使用的 jQuery UI 主题。当主题更改时,它会存储在 cookie 中。页面加载时,如果 cookie 存在,则恢复主题,否则加载默认主题。 当我使用 F
在我的 CSS 中,我使用了以下代码片段: word-break: break-word; -webkit-hyphens: auto; hyphens: auto; 渲染引擎如何知道在所有不同语言中
我的网络浏览器 Safari 有问题,我在 Chrome、FireFox 中测试了我的网站。 Safari 版本也是正确的,但是,当需要在 1920x1080 或更高分辨率下对其进行测试时,它无法正常
就目前情况而言,这个问题不太适合我们的问答形式。我们希望答案得到事实、引用资料或专业知识的支持,但这个问题可能会引发辩论、争论、民意调查或扩展讨论。如果您觉得这个问题可以改进并可能重新开放,visit
我是一名优秀的程序员,十分优秀!