Question

是否可以使用Blueprint CSS并在演示文稿和内容之间保持相当程度的分离？我喜欢框架在设计表单时使用起来有多简单，但我担心我使用css类进行列化元素的方式是一种不好的做法。

例如，假设我有一个使用蓝图设计的3字段表单：

<div class="container">
    <form action="" method="post" class="inline">               
        <fieldset> 
            <legend>Example</legend> 
            <div class="span-3"> 
                <label for="a">Label A:</label> 
                <input type="text" class="text" id="a" name="a" > 
            </div> 
            <div class="span-2"> 
                <label for="b">Label B:</label> 
                <input type="text" class="text" id="b" name="b" > 
            </div> 
            <div class="span-3"> 
                <label for="o">Label O:</label> 
                <input type="checkbox" id="o" name="o" value="true" checked="checked" class="checkbox">checkbox one
            </div> 
            <div class="span-2 last"> 
                <input type="submit" value="submit" class="button"> 
            </div> 
        </fieldset> 
    </form> 
</div>

使用类名为“span-2”，“inline”和“last”的类属性是一种不好的做法吗？或者我错过了这一点？

更新

更深入地讨论了这个问题： THE MYTH OF CONTENT AND PRESENTATION SEPARATION

Answer 1

我会说这是不好的做法。您应该提出更直接适用于您的标记的更有意义的类名和ID，然后让这些“使用”诸如span-2和last之类的内容。这可以使用蓝图的compress.rb。

来完成

有关使用它的详细信息，请访问：http://jdclayton.com/blueprints_compress_a_walkthrough.html

特别是对于你所说的，你应该注意“semantic_classes”部分。

Answer 2

我会说你错过了这一点。如果你想要设置这些元素的样式，你将不得不给它们一个类或ID，只要它保持一致，任何命名约定都会变得有意义。喜欢抱怨课程名称的人通常不是很好的设计师。

设计表单时的蓝图CSS以及表示和内容的分离

2 个答案: