#1和#2有区别吗？我正在考虑跨浏览器兼容性和可访问性.我是否应该选择另一种方法,或者它没有什么区别？欢迎任何有关该主题的文章的链接.
<div class="tags">
<ul>
<li>tag 1</li>
<li>tag 2</li>
<li>tag 3</li>
</ul>
</div>
<ul class="tags">
<li>tag 1</li>
<li>tag 2</li>
<li>tag 3</li>
</ul>
我遇到了Firefox最疯狂的问题.我不确定这个问题是来自Firefox本身,还是来自我的自定义Web服务器(内置Delphi)或它可能是什么.这个问题只发生在Firefox(和Opera)中,它既可以将所有内容从头部向下移动到正文,也可以在正文的开头添加随机字符.奇怪的是,它甚至可以使用完全100%空的网页.
我正在测试一个简单的页面:
<html>
<head>
<title>Test</title>
</head>
<body>
</body>
</html>
至于Web服务器,我正在使用IdHTTPWebBrokerBridge(Indy)在Delphi中构建一个自定义HTTP应用程序,并简单地替换ContentStream(或Content)Request类似的...
procedure TDashModule.DashConsoleHomeAction(Sender: TObject;
Request: TWebRequest; Response: TWebResponse; var Handled: Boolean);
begin
Response.ContentType:= 'text/html';
Response.ContentStream:= TFileStream.Create('C:\SomeDir\SomeFile.html', fmOpenRead or fmShareDenyNone);
end;
... SomeFile.html上面发布的空页面在哪里,该过程是默认请求处理程序的事件处理程序.
在Chrome,IE,Safari等中,一切都与原始代码完全相同.但是,Firefox(和Opera)正在制作这个:
<html>
<head>
</head>
<body>

<title>Test</title>
</body>
</html>
如您所见,title标签已向下移动到body,并且一些随机字符出现在正文的开头.在Firefox中查看原始页面作为其原始文件时,它会正确显示.但是当在Delphi中使用我的Web服务器时,Firefox正在销毁这个页面(以及所有页面,就此而言).
有什么可以做到这一点以及如何解决它？
重现步骤
A)仅使用以下内容创建一个新的HTML页面(对我来说,在Visual Studio 2010中):
<html>
<head>
<title>Test</title>
</head>
<body>
</body>
</html>
B)在Delphi XE2中,启动一个新项目: File > New > Other... > Web Broker > Web …
有没有办法将文字<p>放在图像上？不使用CSS或JavaScript.只是简单的HTML.原因是这种技术或方法将用于不支持css或javascript的旧手机.它也不支持"背景"属性.
我正在寻找一个跨浏览器解决方案来处理回车,从文本框提交输入.
我目前的问题是firefox ...
javascript事件未定义
<input id="myinput" type="text" onkeydown="press();" value="X"/>
<script type="text/javascript">
function press() {
if (event.keyCode == 13) {
// do something
}
}
<script>
我可以使用jquery.
我正在寻找一些好东西,我可以粘贴在页面上并完成它.
该脚本应检测早于9的IE版本,并显示一个漂亮的弹出窗口,其中包含指向不同浏览器的链接或类似的东西.我可以自己做,但我宁愿不重新发明轮子.
我不能让font-face工作的IE7和IE8.
我使用的代码是:
@font-face {
font-family: 'DroidSans';
src: url('fonts/DroidSans.eot');
src: url('fonts/DroidSans.eot?iefix') format('eot'),
url('fonts/DroidSans.woff') format('woff'),
url('fonts/DroidSans.ttf') format('truetype'),
url('fonts/DroidSans.svg#webfont1BSMunJa') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'DroidSans';
src: url('fonts/DroidSans-Bold.eot');
src: url('fonts/DroidSans-Bold.eot?iefix') format('eot'),
url('fonts/DroidSans-Bold.woff') format('woff'),
url('fonts/DroidSans-Bold.ttf') format('truetype'),
url('fonts/DroidSans-Bold.svg#webfont1BSMunJa') format('svg');
font-weight: bold;
}
@font-face {
font-family: 'Lobster';
src: url('fonts/Lobster.eot');
src: url('fonts/Lobster.eot?iefix') format('eot'),
url('fonts/Lobster.woff') format('woff'),
url('fonts/Lobster.ttf') format('truetype'),
url('fonts/Lobster.svg#webfont1BSMunJa') format('svg');
font-weight: normal;
font-style: normal;
}
我读过这些文章:
他们都说这个解决方案应该是跨浏览器兼容的:
浏览器兼容性:Safari,IE 6-9,IE 9兼容模式,Firefox,Chrome,iOS,Android,Opera
我究竟做错了什么？有没有人有这方面的经验？
我在这里测试一下:dev.holiday.ge/xhtml/
我为Firefox和Chrome构建了一个Greasemonkey用户脚本,现在我想将其转换为Safari扩展和Opera扩展.
是否有像Arantius的Greasemonkey-to-extension编译器那样的编译器,但对于Opera或Safari？
cross-browser userscripts browser-extension safari-extension opera-extension
CSS看起来如下:
.rotate
{
-webkit-transition: all .5s ease-in-out;
-moz-transition: all .5s ease-in-out;
-o-transition: all .5s ease-in-out;
-ms-transition: all .5s ease-in-out;
}
.rotate:hover
{
-webkit-transform: rotate(90deg) scale(1);
-moz-transform: rotate(90deg) scale(1);
-o-transform: rotate(90deg) scale(1);
-ms-transform: rotate(90deg) scale(1);
}
将鼠标悬停在一个<span class="rotate">将在Firefox中旋转元素但不旋转铬.
演示:http://jsfiddle.net/BuHGQ/(将鼠标悬停在箭头上方)
可以做些什么才能在Chrome中运行？
我有一个HTML5画布图像,我绘制了一些点,我想在点旁边对齐一些div标签和文本输入标签.
不幸的是,浏览器不同意每个div和输入标签之间的空间.
通过使用CSS指定高度,我发现了输入标记的黑客攻击.现在输入标签在每个浏览器之间具有相同的空间.根据浏览器的不同,输入标签的默认高度似乎不一样,非常非常奇怪.
我为我的div标签尝试了同样的事情,但我无法为每个浏览器获得正确的对齐方式.
文本输入标签对齐与每个浏览器一起使用CSS hack:http: //jsfiddle.net/baptx/XcKZj/
div标签对齐方式不同,具体取决于浏览器(为Firefox配置):http: //jsfiddle.net/baptx/92gPY/
我在Linux上使用Firefox,我注意到Windows版本没有渲染相同的边距.在Linux或Windows上运行时,Chrome也不同意Linux Firefox.Opera很棒,它总是与在Linux或Windows上运行的Linux Firefox一致.
我首先想到的是,这是由于网页浏览器引擎,Gecko渲染与Webkit相比有所不同,但如果Windows和Linux版本的Firefox不同意,那应该是别的了.
有没有人和想法来自哪里以及如何使用div标签解决这个问题？
我在html页面中使用以下CSS代码以设置H1和H2颜色值.
<style type="text/css">
img
{border-style: none;}
H1 {color: "#33CCFF"}
H2 {color: "#33CCFF"}
</style>
这适用于Internet Explorer,但Chrome,Safari和Firefox都失败了.
如何解决此问题以支持所有浏览器？
谢谢
cross-browser ×10
css ×5
html ×5
css3 ×2
javascript ×2
browser ×1
colors ×1
css-reset ×1
delphi ×1
firefox ×1
indy ×1
jquery ×1
layout ×1
userscripts ×1