首页 > 代码库 > 高大上的动态CSS
高大上的动态CSS
项目里要添加 custom css 功能 (dynamic stylesheet ),总结一下实现方法。
1。在JSP中动态设定文件path
预先生成一些css文件,由用户选择,在jsp被请求时,动态加载用户选择的css文件。
xml 代码
- <link rel="STYLESHEET" type="text/css" href=http://www.mamicode.com/"css file" >
<link href="http://www.mamicode.com/动态设定样式文件" type="text/css" rel="STYLESHEET">
这种方法,网上讲很多。
2。覆盖CSS样式
利用CSS的一个特点,即当有重名样式时,新的样式内容将覆盖旧的,对使用样式的元素来说,就是使用就近的样式内容。
所以,我们可以在中引用一个默认的样式文件,然后,将客户订制的CSS样式,动态输出到JSP的
<link href="http://www.mamicode.com/默认样式文件" type="text/css" rel="STYLESHEET">
xml 代码
- <link rel="STYLESHEET" type="text/css" href=http://www.mamicode.com/"default css file" >
- <style type="text/css">
- <!---->
- style>
之中,这样客户订制的css就会覆盖默认样式。
3。使用jsp来动态生成CSS
将css样式文件,改名为.jsp,引用样式文件时,使用这个jsp文件,就可以动态生成样式了。mycss.jsp如下<!---->
xml 代码
- <%@ taglib prefix="c" uri="http://java.sun.com/jstl/core" %>
- <%
- request.setAttribute("baseColor", request.getParameter("baseColor"));
- request.setAttribute("color", request.getParameter("color"));
- %>
- .myColor {
- color: <c:out value=http://www.mamicode.com/"${color}" default="#003399"/>;
- <c:out value=http://www.mamicode.com/"${baseColor}" default="#cfddee"/>;
- }
在jsp中引用
xml 代码
- <link rel="STYLESHEET" type="text/css" href=http://www.mamicode.com/"/mycss.jsp?baseColor=red&color=blue" >
因为link标签,不能把 request 也传过去,所以要通过url传参数,也可以通过session。
高大上的动态CSS
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。