Dreamweaver 特定的 CSS?
我在 CSS 中使用相当基本的垂直扩展页面布局,并且我正在尝试调整此布局,以便我的客户可以使用 Dreamweaver 中的模板编辑页面。这……好吧,进展艰难。我习惯于手动完成大部分工作,但效果相当好。
我使用类似于 此页面 的最小高度技巧来获取内容可以在浏览器中很好地扩展,以便在大显示器上查看较短的页面。该代码在所有浏览器中都能完美运行(该网站不支持任何早于 IE7 的浏览器,其他浏览器都可以),但 Dreamweaver 无法正确呈现最小高度。
我已经能够通过使用只有 Dreamweaver 使用的 .css 文件(服务器上不存在)来使其工作,这使得它可以在 Dreamweaver 中进行编辑,但是如果提交了该文件,那么神奇的效果就会消失地点。这感觉就像是一个肮脏的黑客行为。
我想,快速的出路是这样的:有没有办法让 Dreamweaver 忽略一行 CSS,或者让它使用一行真正的浏览器会忽略的 CSS?或者,有没有办法让最小高度布局在 Dreamweaver 中正常工作?
我为此使用的代码基本上如下:
站点代码:
html, body {
padding: 0px;
margin: 0px;
height: 100%;
}
body {
position: relative;
width: 100%;
height: 100%;
}
#mainFrame {
position: relative;
min-height: 100%;
width: 980px;
/*center in parent*/
margin-left: auto;
margin-right: auto;
}
以及让 Dreamweaver 满意的代码:
html {
height: 100%;
}
#mainFrame {
height: 100%;
}
我在某处读到 Dreamweaver 的布局引擎基于 IE 的渲染引擎,这可能可以解释大多数问题。我正在使用 CS3,而我的客户正在使用 CS5,这将使事情进一步复杂化,但我已经为此做好了准备。如果有人知道对此的神奇解决方案,我将非常感激,因为我现在已经放弃了它。
谢谢
I'm using a fairly basic vertically expanding page layout in CSS, and I'm trying to adapt this layout so that my client can edit the page using templates in Dreamweaver. It's... well, rough going. I'm used to doing most of this stuff by hand, but it's working out fairly well.
I'm using a min-height trick similar to this page to get the content to expand nicely in the browser, for shorter pages viewable on large monitors. The code works perfectly in all browsers (not supporting anything older than IE7 for the site, and other browsers are fine) but Dreamweaver doesn't render the min-height properly.
I've been able to get it to work by using a .css file that only dreamweaver uses (it doesn't exist on the server) that makes it editable in dreamweaver, but if that file is committed, the magic breaks on the live site. This just feels like a dirty hack.
The quick way out, I guess, is this: is there a way to get dreamweaver to ignore a line of CSS, or to make it use a line of CSS that would be ignored by a real browser? Or, is there a way to get a min-height layout working properly in dreamweaver?
The code I'm using for this is basically the following:
Site Code:
html, body {
padding: 0px;
margin: 0px;
height: 100%;
}
body {
position: relative;
width: 100%;
height: 100%;
}
#mainFrame {
position: relative;
min-height: 100%;
width: 980px;
/*center in parent*/
margin-left: auto;
margin-right: auto;
}
and the code that makes dreamweaver happy:
html {
height: 100%;
}
#mainFrame {
height: 100%;
}
I read somewhere that Dreamweaver's layout engine was based on IE's rendering engine, which would probably explain most of the issues. I'm using CS3, and my client is using CS5, which is going to complicate things further down the line, but I'm already prepared for that. If anyone knows of a magic solution to this, I would appreciate it greatly, as I've kind of given up on it for now.
Thanks
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(3)
我也不使用 Dreamweaver,但是这篇 Adobe 文章IE 条件注释 可能相关:我想知道您是否可以调整 Dreamweaver 首选项来加载真实浏览器会忽略的条件注释版本字符串。
I don't use Dreamweaver either, but this Adobe article on IE conditional comments might be relevant: I wonder if you can adjust the Dreamweaver preferences to load a conditional comment version string that would be ignored by a real browser.
我知道这个答案不会有帮助......但我个人(不会)永远不会依赖所见即所得渲染......我自己使用DW CS5,但仅限于代码视图
i know this answer won't help.... but I personally (would) never rely on WYSIWYG-rendering.... i'm using DW CS5 myself, but only with code-view
我实际上对此提出了自己的答案,这是严重的作弊,但它确实有效。下面使用 CSS 注释来隐藏(从 Dreamweaver 中)PHP 代码,这会导致服务器基本上吐出一个空文件。条件注释几乎肯定是一种更好的方法,但它仍然是一个有趣的解决方案(我认为),并且可能对某人有用。
I actually came up with my own answer for this, which is significant cheating, but it does work. The following utilized CSS comments to hide (from Dreamweaver) PHP code, which causes the server to spit out basically an empty file. Conditional comments are almost definitely a better way to do this, but it's still an interesting solution (I thought) and it might be useful to someone.