代码之家 › 专栏 › 技术社区 › Hassan Khan

Ember.js的CSS继承问题

less ember.js twitter-bootstrap css

Hassan Khan · 技术社区 · 11 年前

我在获取 Inspiritas 作为Ember应用程序。index.html如下所示:

<!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="utf-8">
        <title>title</title>
        <meta name="author" content="me">
        <!--[if lt IE 9]>
            <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
        <![endif]-->
        <link rel="shortcut icon" href="favicon.ico">
        <link href="inspiritas.css" rel="stylesheet">
    </head>

    <body>
        <script type="text/x-handlebars">
            <div class="navbar navbar-static-top navbar-inverse">
                <div class="navbar-inner">
                    <div class="container">
                        ...
                    </div>
                </div>
            </div>
            <div class="container">
                <div class="row-fluid">
                    <div class="span3">
                        ...
                    </div>
                    {{outlet}}
                </div>
            </div><!-- /container -->
        </script>

        <script type="text/x-handlebars" id="dashboard">
            <div class="span9" id="content-wrapper">
                <div id="content">
                    <section id="tables">
                        ...
                    </section>
                </div>
            </div>
        </script>

首先,它不会为 <div class="container"> (不是导航栏里的那个)。相反,它继承了body.ember-application,并在这个过程中丢失了所有的CSS。不过,这种情况只发生在这个容器上。我唯一能缩小范围的是这里的一些定制造型:

body > .container {
    // Color the whole container like the sidebar to fix faux columns
    background: url('images/sidebar_bg.png') repeat @sidebarBackground;

    .border-radius(@borderRadiusLarge);

    // Make some space, eh.
    margin-top: 40px;
    margin-bottom: 40px;
}

更新: 好吧,我不知道为什么,但后来一个类名的更改就彻底失败了,一切都失去了风格。

1 回复 | 直到 11 年前

Pascal Zajac 11 年前

粘贴的CSS规则使用子代选择器,这意味着只有具有 container 直接位于 body 元素的样式。但是,当Ember插入Handlebars模板时,它会通过View将它们包装起来,这会创建另一个中介DIV。我想这是你的样式没有出现的原因。

推荐文章

Shawn · 如何在组件内部完成余烬操作后重定向

6 年前

Sow Hari · 使用余烬计算属性(过滤器)过滤模型,并使用余烬模型表2以表格格式显示。没有可显示的记录

6 年前

AmazingDayToday · Ember:如何获取在Route->Model返回的文件的值

6 年前

Nikolay Shcherba · 在模型挂钩之前使用ember simple auth-in进行身份验证

6 年前

Alexandro · 使用Express和Ember启动web应用程序

6 年前

pbanka · 我的Typescript/Ember 3.1应用程序中有一个枚举,运行时出现导入错误。发生什么事了?

6 年前

Vikrant Siwach · 是否在验收测试中覆盖幻影响应?

7 年前

Androidicus · 余烬/把手:带参数数组的本地化辅助对象

7 年前

Thomas Anuragh27crony · 在余烬组件的生成上下文上测试属性

7 年前

Michel Fernandes · 部署EmberJS前端应用程序[已关闭]

7 年前