0

我页面中的元素首先出现在随机位置，然后在页面完全加载后移动到正确的位置。这一点都不优雅。我希望他们直接出现在正确的地方。我猜这是因为页面中的元素是在我的 css 之前加载的？

我在 Symfony2 项目中使用较少和资产，我该如何处理它以便元素直接出现在正确的位置？

以下是我处理我的 CSS 资产的方式：

    {% block stylesheets %}
        {% stylesheets
            filter='less, ?yui_css'
            output='bundles/yopyourownpoet/css/bootstrap.css'
            '@YOPYourOwnPoetBundle/Resources/public/less/bootstrap.less'
        %}
            <link href="{{ asset_url }}" type="text/css" rel="stylesheet" media="screen" />
        {% endstylesheets %}
        {% stylesheets
            filter='less, ?yui_css'
            output='bundles/yopyourownpoet/css/bootstrap-responsive.css'
            '@YOPYourOwnPoetBundle/Resources/public/less/responsive.less'
        %}
            <link href="{{ asset_url }}" type="text/css" rel="stylesheet" media="screen" />
        {% endstylesheets %}
        <link rel="stylesheet/less" href="{{ asset('bundles/yopyourownpoet/less/bootstrap.less') }}">

        <link href="{{ asset('bundles/yopyourownpoet/css/layout.css') }}" type="text/css" media="screen" rel="stylesheet" />
        <link href="{{ asset('bundles/yopyourownpoet/css/style.css') }}" type="text/css" media="screen" rel="stylesheet" />
        <link href="{{ asset('bundles/yopyourownpoet/css/jquery.cluetip.css') }}" type="text/css" rel="stylesheet" />
    {% endblock %}
4

2 回答 2

0

我回答了你以前的问题。这是这个答案，记住运行与前面所述相同的命令。

{% block stylesheet %}

{% spaceless %}
<!-- global css -->
{% stylesheets
filter='less,?yui_css'
        '../vendor/twitter/bootstrap/less/bootstrap.less'
        '../vendor/twitter/bootstrap/less/responsive.less'
    %}
<link rel="stylesheet" href="{{ asset_url }}"/>
{% endstylesheets %}

{% endspaceless %}
<link href="{{ asset('bundles/bm/css/style.css') }}" type="text/css" rel="stylesheet"/>
<link href="{{ asset('bundles/bm/css/profile.css') }}" type="text/css" rel="stylesheet"/>
{% endblock stylesheet %}
于 2012-07-11T03:33:37.463 回答
0

我现在使用 node 预编译我的 css 文件，并且不再使用 less.js 脚本。

这解决了问题，元素现在直接出现在页面中的正确位置。

于 2012-07-16T02:44:46.863 回答