css css2 css3_选择CSS技术-CSDN博客

css css2 css3

I’ve had so many interesting discussions with people at @media, as these were prompted by the topics discussed by panels or in presentations it’s probably not surprising that I was often having the same conversation a number of times with different people! However one topic that kept coming up was how we decide which methods to use when working with CSS.

我在@media与人们进行了许多有趣的讨论，因为这些讨论是由小组讨论或在演示文稿中引起的，因此经常与不同的人进行相同的对话可能并不奇怪！然而，一个不断出现的话题是我们如何决定使用CSS时要使用的方法。

At this point in time for most end results there are a few available paths. Take for example, the requirement to clear floated elements. The conventional and recommended way of doing this has, for some while now, been to add a redundant element underneath the floated elements. However, a recent technique for self-clearing floats, as detailed on Position is Everything, gives us a method to achieve this without adding the additional div to the mark-up. At first glance this seems like a preferable method, after all we have been banging on for years now about separating our presentation from our content and document structure haven’t we? However I’m not completely comfortable with this method yet.

此时，对于大多数最终结果，有一些可用的路径。例如，要求清除浮动元素。一段时间以来，常规的推荐方法是在浮动元素下方添加一个冗余元素。但是，最近的一种用于自动清除浮点的技术（如“位置就是一切”中所述）为我们提供了一种在不增加额外div标记的情况下实现此目的的方法。乍一看，这似乎是一种更可取的方法，毕竟我们已经花了很多年的时间才能将演示文稿与内容和文档结构分开，对吗？但是我对这种方法还不完全满意。

The self clearing floats method requires that you add a bunch of hacks to your CSS to get this technique to work cross-browser. I’m very much of the school of thought that says hacks are a last resort, much of my CSS work is completely hack-free because I would rather look for an alternate way to achieve the same visual effect than resort to a CSS hack – where that is possible. I am not sure that peppering your CSS with hacks is preferable to adding one redundant element. The argument against this would be that adding ‘just one redundant div’ is starting you down the slippery slope of mixing your presentation with your document structure. However that extra div doesn’t have the same implications as using a bunch of nested tables does, for example. It’s a pretty benign element, it won’t create an accessibility issue when a user with a screenreader comes to the content for example. In an ideal world it wouldn’t be there, but I don’t inhabit this ideal world!

自清除浮点方法要求您向CSS添加大量技巧，以使该技术可以跨浏览器工作。我非常喜欢说骇客是万不得已的想法，我的大部分CSS工作都是完全不受黑客攻击的，因为我宁愿寻求一种替代方法来实现相同的视觉效果，而不是诉诸于CSS骇客–在可能的地方。我不确定用hacks来添加CSS优于添加一个冗余元素。反对这一观点的理由是，添加“仅一个冗余div”会使您开始将演示文稿与文档结构混合在一起。但是，例如，额外的div与使用一堆嵌套表的含义不同。这是一个很好的元素，例如，当具有屏幕阅读器的用户访问内容时，它不会造成可访问性问题。在理想的世界中不会存在，但我不会居住在这个理想的世界中！

The above is just one example of a situation where we come across two different ways of achieving the same end visual result. For other techniques there are a number of methods, for example the range of methods for achieving rounded corners on boxes. When I come up against a particular ‘how do I create this in CSS’ issue I tend to look at the available options, which might involve some research if I haven’t completed this particular task before, or haven’t done so for a while and want to check for new techniques. With the range of methods I then have, some I discount immediately, either due to the constraints of the project, or the browsers that I have to support. With the rest – assuming I have a range of slightly sub-optimal ways to achieve the visual effect, some needing extra mark-up, others needing CSS hacks – I have to decide which does the least harm. Which will be easily maintainable? Which will my client understand when I hand the project back to them? Do any of these present any accessibility issues? The answer may be different depending on the context of the project, what I might choose for a personal project that I can dive in and fix if a new browser blows it all up is often different to what I would choose for work I am going to hand over to a client to implement themselves. Like so much that we do, there are no fixed answers, and I am constantly refining and developing my own skills and methods.

上面只是一种情况的示例，我们遇到了两种获得相同最终视觉效果的不同方法。对于其他技术，有许多方法，例如，用于在盒子上实现圆角的方法范围。当我遇到一个特定的“如何在CSS中创建它”问题时，我倾向于查看可用的选项，如果我以前没有完成此特定任务，或者对于一个特定的任务还没有这样做，则可能涉及一些研究。同时想检查新技术。然后，由于项目的限制或我必须支持的浏览器，我有了一系列的方法，我立即打了折扣。对于其余的部分（假设我有多种实现视觉效果的次优方法，有些需要额外的标记，另一些需要CSS技巧），我必须决定哪一种危害最小。哪个将易于维护？当我将项目交还给客户时，客户会理解什么？这些是否存在任何可访问性问题？答案可能会有所不同，具体取决于项目的上下文，我可能会选择的个人项目，如果新浏览器将其全部炸毁的话，我可以选择并修复的项目通常与我将要选择的工作有所不同。交给客户实施。就像我们所做的事情一样，没有固定的答案，我正在不断完善和发展自己的技能和方法。

So, what do you do? How to you decide which method to use when faced with a bunch of ways to achieve the same end result? Are there any particular issues where you have found it difficult to decide which method to choose, or has a method you have chosen come back and bitten you afterwards?

所以你会怎么做？面对多种方法来达到相同的最终结果时，如何决定使用哪种方法？是否有任何特定的问题使您难以决定选择哪种方法，或者选择的方法之后又被您咬伤？

[tags]atmedia, atmedia2006, css[/tags]

[tags] atmedia，atmedia2006，css [/ tags]