设计数据库原则4个原则

As you progress in CSS, there are four important design principles that need to be kept constantly in mind. This succinct design philosophy will influence not only your page design but also the code you write.

随着CSS的发展 ，有四个重要的设计原则需要牢记在心。 这种简洁的设计理念不仅会影响您的页面设计，还会影响您编写的代码。

Your design should be fluid whenever possible. 您的设计应尽可能流畅。

This approach, known broadly as responsive or adaptive design means using relative CSS units rather than fixed ones: percentages and ems rather than pixels and centimetres. There will always be exceptions to this: it makes more sense to measure bitmapped images, such as JPEGs, in pixels, and often elements that relate to images need to be measured in pixels to match. But as a general rule, use ems and percentage measurements over static, fixed measurements.

这种被广泛称为响应式或自适应设计的方法意味着使用相对CSS单位而不是固定单位 ：百分比和ems，而不是像素和厘米。 总是会有例外：以像素为单位测量位图图像(例如JPEG)更有意义，并且与图像相关的元素通常需要以像素为单位进行测量才能匹配。 但通常，将ems和百分比测量值用于静态固定测量值。

“Pixel-perfect” design – trying to set every element to an exact position on a web page – is a mirage. “像素完美”设计–试图将每个元素设置到网页上的精确位置–是一种幻象。

CSS to suit their needs, block images, even turn CSS and / or CSS以适应他们的需求，屏蔽图像，甚至完全关闭CSS和/或JavaScript off entirely. A stylesheet is a pragmatic specification of how you would prefer the user to see your content, with the understanding that this is ultimately not under your control. JavaScript 。 样式表是实用的规范，说明了您希望用户如何查看您的内容，但要理解，这最终不受您的控制。

This drives many traditional designers crazy: “I want this exactly there. Why can’t I do that?” The answer is that HTML and CSS are not desktop publishing tools, and that web pages are not fixed, static productions, unlike the printed page.

这种疯狂的驱动器的许多传统的设计：“我想这正是那里 。 我为什么不能那样做？” 答案是HTML和CSS不是桌面发布工具，并且网页不是固定的，静态的作品，与印刷页面不同。

Others, knowing just enough CSS to be dangerous, fall into using position: absolute for everything. In the words of Admiral Akbar: “It’s a trap!” Absolute positioning, while useful in certain limited circumstances, is to be avoided as a general design tool, for reasons discussed earlier.

其他人只知道有足够CSS危险就可以使用position: absolute适用于一切。 用阿克巴尔海军上将的话说：“这是一个陷阱！” 绝对定位虽然在某些有限的情况下很有用，但由于前面讨论的原因，应避免将其作为通用设计工具。

Similarly, having content appear “exactly the same in every browser” is a pipe dream. 同样，让内容“在每个浏览器中都完全相同”是一个梦pipe以求的事情。

work, effort and time will increase exponentially the older and more varied the browser support becomes. If a client wants the website to look exactly the same in Netscape 4 as it does in Safari 5, and have the latest bells and whistles, that becomes a real problem. 工作，工作量和时间会成倍增加，而且越老越多。浏览器支持变得多种多样 。 如果客户希望该网站在Netscape 4中的外观与在Safari 5中的外观完全相同，并且拥有最新消息，那就成了一个真正的问题。

My personal philosophy is, at this time, to support IE10, Firefox 11, Safari 5, Opera 11, Chrome 14, and above. I will, grudgingly, work with IE8, but doing so significantly raises production time for many designs.

目前，我的个人观点是支持IE10，Firefox 11，Safari 5，Opera 11，Chrome 14及更高版本。 我会勉强地使用IE8，但是这样做会大大延长许多设计的生产时间。

You will not always have a call on this. If your client has IE6 and does not wish to upgrade, and you take on the job, that’s what you have to work with. Saying “it looks fine at home” will not be an excuse.

您将不会总是对此打电话。 如果您的客户端具有IE6，并且不希望升级，而您要承担工作，那么您就必须使用它。 说“在家看起来还不错”将不是借口。

Design with “graceful degradation” in mind. 设计时要考虑“平稳降级”。

CSS, you are adding a visual aspect or feature that would be CSS的新功能，那么您将添加视觉方面或功能，这将是nice but not 不错的，但对于用户来说并不是necessary for the user to experience. No visitor to your site should be denied your content because they lack the very latest version of a particular browser or plugin. They may not see it with all the “bells and whistles” added, but they should still see the content. 必需的。 不应拒绝访问您网站的访问者的内容，因为他们缺少特定浏览器或插件的最新版本。 他们可能看不到添加了所有“铃铛和口哨”的内容，但是他们仍然应该看到内容。

This same principle is also applicable to Flash and JavaScript on the web. Technologies should be used to enhance content, rather than the website relying on them.

同样的原理也适用于Web上的Flash和JavaScript 。 应该使用技术来增强内容，而不是依赖它们的网站。

This should, at the rational end, be applied to CSS in its entirety: can your website still be used if no CSS is applied at all? That is, after all, how search engines see your site: they index semantic content, not CSS. (The easiest way to answer this question is to turn off CSS in your browser's Web Developer toolbar and see how your website responds.)

从合理的角度来看，这应该完整地应用于CSS：如果根本不使用CSS，您的网站仍可以使用吗？ 毕竟，这就是搜索引擎如何看您的网站：它们索引语义内容，而不是CSS。 (回答此问题的最简单方法是在浏览器的Web Developer工具栏中关闭CSS，然后查看您的网站如何响应。)

翻译自: https://thenewcode.com/70/Four-Design-Principles

设计数据库原则4个原则