标签: dynamic-css

我知道你可以使用CSS来使用StyleManager在Flex中设置对象的样式:http://livedocs.adobe.com/flex/3/html/help.html？content =
styles_07.html

您还可以动态加载已编译的 CSS文件(SWF):http:
//livedocs.adobe.com/flex/3/html/help.html？content = styles_10.html

但是,我使用Web GUI和服务器端脚本动态创建CSS文件.如果更改了CSS,那么脚本还需要将CSS编译为SWF(这不是一个可行的选项).有没有办法解决？

我正在做一个tumblr页面.我有两个不同的html页面背景,我希望DAY背景显示从早上7点到晚上8点,夜晚背景显示从晚上8点到早上7点.

我决定在php中这样做,但是当涉及到php时,我总是新手.我的朋友给我发了一个我可以使用的示例代码.但我不知道该怎么做.你们能帮忙吗？

这是示例代码.

<?php
header('content-type: text/css');

date_default_timezone_set("America/Vancouver");
$now = date('G');

if ($now < 12) {
    $bg = '#FFFFFF';
} else {
    $bg = '#000000';
}
?>

body {
    background: <?php echo $bg; ?>;
}

好吧,我有两个不同的背景.jpgs,我想用它作为背景,取决于它是什么时间.我想要从早上7点到晚上8点的阳光背景和从晚上8点到早上7点的夜晚背景.

我正在处理远程html文件,我将背景和图形存储在与实际html文件不同的服务器上.大多数css都在html文件中,除了包含我分离并移动到外部样式表的背景代码的body部分.我制作了两张单独的样式表,一张是白天bg图像,一张是晚上.这是夜间css样式表上的身体css.

@charset "UTF-8";
/* CSS Document */

         body { 
                background-image: url('http://itsnotch.com/tumblr/images/daytime_bg.jpg') !important;
                background-repeat: repeat-x !important;
                background-attachment: fixed !important;
                background-position: top center !important;
                background-color:#b68e59 !important;
                margin-top:-5px !important;
                font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
                font-size:14px !important;
         }

我写了一个我觉得可行的javascript代码.但事实并非如此.我把它放在正下方,它仍然无法正常工作.它为什么不起作用？我只是希望能够时间敏感地切换背景.

<script type="text/JavaScript">
<!--
function getStylesheet() {
      var currentTime = new Date().getHours();
      if (7 <= currentTime&&currentTime < 20) {
       document.write("<link rel='stylesheet' href='http://itsnotch.com/tumblr/files/daytime.css' type='text/css'>");
      }
      else {
       document.write("<link rel='stylesheet' href='http://itsnotch.com/tumblr/files/nighttime.css' type='text/css'>");
      }
      rel='stylesheet' href='night.css' type='text/css'>");
      }
}

getStylesheet();
-->
</script>

<noscript><link href="http://itsnotch.com/tumblr/files/daytime.css" rel="stylesheet" type="text/css"></noscript> …

我想在视图中创建一个动态CSS文件,然后渲染一个加载该CSS文件的模板.根据给视图的参数,每次调用视图时,CSS在某些位置可能具有不同的值.我该怎么做呢？(我应该补充一点,我没有在Python/Django中编写文件的经验.)

这是我认为它应该如何工作的简化示例:

# urls.py
urlpatterns = patterns('',
    (r'^myview/(?P<color>[0-9a-f]{6})/$', create_css_file),
)

# views.py
def create_css_file(request, color):
    raw = "@charset 'UTF-8';\n\n"
    raw += "body {\n"
    raw += "  color: #" + color + ";\n"
    raw += "}\n\n"

    f = open('mydynamic.css', 'r+')
    f.write(raw)

    return render_to_response('mytemplate.html', locals())

# mytemplate.html
{% extends "base.html" %}
{% block head %}
    <link rel="stylesheet" media="screen" href="{{ f.name }}" />
{% endblock %}

出于某种原因,这不起作用,尽管在生成的HTML页面的源代码中,看起来CSS文件正确加载.该f连在模板到达正确的,因为我可以看到它的内容,当我改变<link>...行

<link rel="stylesheet" media="screen" href="{{ f }}" />

(f而不是f.name).但HTML呈现时没有所需的颜色设置.任何人都可以告诉我为什么会这样吗？ …

我正在写一个css/js页面,里面有一些动态部分.为此,我使用包含css/js的cshtml文件 - 我正在使用mvc.net并从控制器操作返回css.

问题是visual studio将此页面识别为html而不是javascript/css,因此它不会给我javascript/css着色和IntelliSense.

我的问题:

1. 是否有更好/更简单的方法在.net中创建动态css/js
2. 我怎样才能让visual studio将cshtml页面识别为javascript.

我需要一些用于动态 WordPress 插件的 CSS，并且想知道什么是最好或最常见的方法。我目前正在使用方法二，但在 IE9 上遇到问题。所以我认为动态 CSS 可能有更好的解决方案，并提出了这些：

1.) 包含一个带有钩子的样式wp_head块

专业人士：

• 没有额外的服务器请求

魂斗罗：

• 根据大小，每页上有很多数据
• 不太漂亮
• 不可缓存

admin_url('admin-ajax.php?action=my_css')2.)在链接标签中使用

专业人士：

• 即时创建 CSS（并使用 Transient API 对其进行缓存）
• 用途wp_enqueue_style
• 可通过过期标头进行缓存

魂斗罗

• 需要加载wp-load.php
• 不适用于 IE9（为什么？）

3.) 创建一个关于更改的 CSS 文件

专业版

• 快速地
• 无需加载整个 WordPress ( wp-load.php)

魂斗罗

• 不是真正动态的
• 需要为某些文件夹编写规则
• 可能是过时或缺失导致脚本问题或权限缺失的原因

我不喜欢方法一，因为并不是每个页面都需要该样式，而方法二在 IE9 上不起作用。

我应该选择第三个还是它有什么缺点？

提前致谢！

我有一些非常基本的HTML和CSS,我希望有"粘性页脚"效果.这是我公司内部的应用程序,因此我们只能执行最新的浏览器(IE11 +).我看到IE9 +支持CSS calc()动态属性,所以我把它用来使用.

HTML

<div id="wrap">
    <h1 id="title">The Title</h1>
    <div id="content">
        <p>Stuff....</p>
    </div>
</div>

CSS

html,
body,
#wrap{
    height: 100%;
}
#title{
    height: 60px;
}
#content{
    min-height: 100%; /*fallback*/
    min-height: calc(100% - 60px); /*the title is 60px tall*/
}

JS小提琴 | 全屏演示

这在Chrome和Firefox中效果很好,但IE11(我唯一关心的版本)在调整窗口大小时不会重新计算此值.有时它似乎也不必要地延伸到页面的末尾,因此在不需要时会导致滚动.

而我在这里做错了,或者这是一个IE错误？

这是一个好主意通过PHP提供css文件？

实际上我有一个大的CSS文件,其中包括所有媒体查询,所以我认为只根据传递到php页面的参数提供选定的部分例如在我原来的php页面我会这样做

<link rel="stylesheet" type="text/css" href="css.php?<?= "theam=".$theam ."&screen=".$screen ?>"/>

并在css.php文件中我将检查条件以给出响应,只需要css这是正确的方法吗？

我喜欢在我的CSS文件中使用PHP变量,但我不想为每个文件加载加载整个Symfony堆栈.任何人都有任何最佳实践和/或插件来管理他们在Symfony中的CSS文件？

我正在寻找像facebook这样的页脚,但只使用CSS来设置它没有js.

正如你在http://dl.getdropbox.com/u/5910/Jing/2009-02-03_1256.png中看到的那样,即使我向下滚动,它也始终保持在底部.http://dl.getdropbox.com/u/5910/Jing/2009-02-03_1258.png

我想仅使用javascript 动态更改使用的CSS File(<link href="..." />)并保存cookie中的更改.

这是一个jQuery版本,它做我想要的(ref),但我怎么能在javascript中做到这一点？

if($.cookie("css")) {
    $("link").attr("href",$.cookie("css"));
}
$(document).ready(function() {
    $("#nav li a").click(function() {
        $("link").attr("href",$(this).attr('rel'));
        $.cookie("css",$(this).attr('rel'), {expires: 365, path: '/'});
        return false;
    });
});

先感谢您.

有没有办法将CSS样式表拉入FireFox 2或3中,而不是静态文件？

Bellow是我们用来引入由CGI脚本动态生成的样式表的代码.

<link rel="stylesheet" href="/cgi-bin/Xebra?ShowIt&s=LH4X6I2l4fSYwf4pky4k&shw=795430-0&path=customer/DEMO/demo1.css" type="text/css">

/cgi-bin/Xebra?ShowIt&s=LH4X6I2l4fSYwf4pky4k&shw=795430-0&path=customer/DEMO/demo1.css

请注意,上面提取CSS的URL并不以.css结尾,而是以参数为结尾.

我试图根据当前页面宽度向页面添加某些样式.我希望这能在现场发挥作用.例如,在iPhone上查看并在查看已加载的页面时旋转屏幕时,css将会更改.另外,我最好使用移动jquery库.在此先感谢您的帮助.这是我到目前为止似乎没有工作,我尝试使用LiveQuery也没有用

$(function() {
    $(document).live('css_init', function() {
           if (($(window).width()) > 430) {
                $('#main_panels .next').addClass("next-wide");
                $('#main_panels .prev').addClass("prev-wide");

           };
       });
       $(document).trigger('css_init');
});