html添加变量参数吗,动态CSS与变量参数？ (可能吗？)

CSS不是一种编程语言. CSS3在这里或那里有一点逻辑,但没有switch().

为了您的目的,到目前为止,最简单的解决方案是一个javascript,这里提供假设您使用jQuery：

var $navLis = $('nav[role=navigation] > ul > *');

$navLis.addClass('count'+$navLis.length); // add a class to every li indicating

// total number of list items

然后在你的CSS中

nav[role=navigation] li { /* default styling & width */ }

nav[role=navigation] li.count2 { /* your conditional styling */ }

nav[role=navigation] li.count5 { /* your conditional styling */ }

/* etc */

或直接使用jQuery设置宽度：

$navLis.style('width', (100/$navLis.length)+'%');

如果你要求纯CSS,那就得出你的逻辑帽子,看看CSS3 selectors specification.你可以构造一些拜占庭式,而且比较脆弱的CSS代码可以伪造逻辑,比如下面的选择器.

nav[role=navigation] li:first-child + nav[role=navigation] li:last-child {

/* matches last of two items if a list has only two items */

}

如果您使用的CMS知道将要放入的列表中有多少项目,那么您可以通过在您的CSS中添加一点PHP来获得您的服务器后端：

if (isset($_GET['navcount']) && $_GET['navcount'] != "") {

$navcount = $_GET['navcount'];

} else { $navcount = 5.0; } // Default value

/* ... your css code here... */

nav[role="navigation"] li {

float: left;

width: <?php echo (100.0/$navcount); ?>%;

}

那么你从你的HTML请求这样的CSS / PHP脚本：

有一些很棒的工具,用于编写可以很好地混合到CSS中的样式表,有些甚至可以动态地提供PHP实现.现在最强大的CSS扩展是Sass,它只是你要找的语法.我建议使用Sass通过Compass,这是一个真正给它一些牙齿的Sass框架.您可以使用phamlp在PHP中将Sass解析为CSS

虽然指南针(和Sass)是非常棒的工具,但将其插入现有项目可能比其价值更麻烦.你可能只想使用Javascript做简单的逻辑.

html添加变量参数吗,动态CSS与变量参数？ (可能吗？)相关推荐

css的属性是变量是怎么表达,CSS自定义变量属性——像less，sass那样在css中使用变量（译）...
初步使用 :root { --main-color: #06c; --accent-color: #006; } /* The rest of the CSS file */ #foo h1 { // ...
Linux动态库环境变量设置
永久生效的环境变量设置,编辑/etc/profile即可. vi /etc/profile 在文件里末尾加上对应的环境变量信息. 动态库环境变量设置: export LD_LIBRARY_PATH=/ ...
[CSS] 自定义变量带你随心所欲，一键换肤
认识CSS自定义变量 CSS自定义属性?听着怎么那么神奇呢,属性还可以自定义,那不是可以放肆地玩耍?我自己定义的属性浏览器都能认识? 一.基础 (一)名字和用途其实CSS自定义属性还有很多小名,比如 ...
动态调整线程池参数实践
欢迎大家关注我的微信公众号[老周聊架构],Java后端主流技术栈的原理.源码分析.架构以及各种互联网高并发.高性能.高可用的解决方案. 一.线程池遇到的挑战我们上一篇 <一文读懂线程池的实现原 ...
LESS是一个CSS预处理器，跨浏览器友好，提供诸如变量，函数， mixins 和操作等功能，可以构建动态CSS...
什么是LESS? LESS是一个CSS预处理器,可以为网站启用可自定义,可管理和可重用的样式表. LESS是一种动态样式表语言,扩展了CSS的功能. LESS也是跨浏览器友好. CSS预处理器是一种脚 ...
php动态添加div,jq如何动态添加动态css样式
jq动态添加动态css样式的方法:首先准备jquery库文件,并声明一个class样式:然后准备一个事件加载初始化的方法,并直接用匿名函数:接着addClass方法给div元素添加class:最后通过 ...
css 识别变量中的换行符_跟我一起全面了解一下CSS变量
什么是css变量? CSS变量,即CSS variable.官方的名称是级联变量的CSS自定义属性,即CSS custom properties for cascading variables.类似于 ...
python创建变量_Python每天一分钟：给类对象动态新增/删除成员变量和方法(函数)...
一般类对象新增变量或方法的过程在面向对象(OOP)的编程方法中,如果需要给实例化的类对象新增方法或者属性,一般都是在class类的定义中新增内容,然后才能用类对象来调用新增的方法或变量.如在C++中 ...
Android组件化专题-路由动态注入跳转参数以及获取其他模块的fragment
上几篇组件化专题文章,我们对路由框架基本实现了,Activity之间当跳转和模块间当通信. 现在思考一个问题: 不管是在Activity或者Fragment,跳转都会传递一些参数,然后在对应对Acti ...
css定义变量(定义:--aa;使用:var(--aa)、calc()计算样式函数
一.兼容性 2017年3月,微软宣布 Edge 浏览器将支持 CSS 变量.这个重要的 CSS 新功能,所有主要浏览器已经都支持了. 二.用法声明css变量的时候,变量名前面要加两根连词线(--). ...

html添加变量参数吗,动态CSS与变量参数？ (可能吗？)

html添加变量参数吗,动态CSS与变量参数？ (可能吗？)相关推荐

最新文章

热门文章