这就是我想要完成的事情:
我需要一个与div右侧相距一定距离的按钮,无论视口大小如何,它都与div侧面的距离相同,但会随窗口滚动.
所以它始终是div右侧的x像素,但始终是视口顶部的y像素.
这可能吗？
我正在使用wordpress的根主题:https://github.com/retlehs/roots/
它已经预编译了bootstrap.css,并建议使用app.css进行任何自定义.由于我没有通过html或javascript将类添加到按钮的选项,我想使用LESS源来引用一个css类,例如,我想给一个提交按钮引导按钮样式:
input#submit{
.btn;
.btn-primary;
}
如果我使用@import 'bootstrap.less';它将整个bootstrap css添加到app.css中.我怎样才能使用bootstrap.less作为编译参考？
我有一个Lessmixin定义为:
.fontStyle(@family, @size, @weight: normal, @style: normal, @color: #ffffff, @letter-spacing: normal) {
font-family: @family;
font-size: @size;
color: @color;
font-weight: @weight;
font-style: @style;
letter-spacing: @letter-spacing;
}
我该如何定义用法:
.fontStyle('NimbusSansNovCon-Reg', 12px, , , , 0.1em);
IE使用的默认值@weight,@style,@color
我想将浮点变量与整数进行比较.我知道这不是最好用bash做的,但我的整个脚本已经用bash编写了.$ number可以是任何整数.如果它低于或等于50,我想要output1,对于所有其他我想要输出与另一个变量k.这是我到目前为止:
number=43
test=$(echo "scale=2; $number/50" | bc -l)
echo "$test"
for k in {1..5}
do
if ["$test" -le 1]
then echo "output"
elif ["$test" -gt $k]
then echo "output$k"
fi
done
如果我尝试使用test = 0.43,则第一个循环甚至不起作用.我认为它与整数和浮点比较有关,但不能使它工作.
我错过了什么？
PS:这[0.43: command not found是终端输出的内容.
一个基本的CSS示例.我遇到的每个浏览器都会使用边距和填充以及红色边框渲染项目
.test{
margin: 4px;
border: 1px solid black;
padding: 4px;
}
.test{
border: 1px solid red;
}
当然,如果我手工编写这个CSS,我会用红色替换黑色,只有一个规则.
但是,如果第一个规则来自父CSS文件(或者在我的情况下是LESS文件),我无法编辑,因为它在其他地方使用,或来自我不想破解的第三方库,那么我看到别无选择,只能添加额外的规则.
现在因为我使用服务器端LESS - > CSS编译缩小,对我来说似乎完全合理的是压缩器/缩小器应该将规则减少到仅仅
.test{
margin: 4px;
border: 1px solid red;
padding: 4px;
}
但是我所尝试过的一切都遵守了这两条规则; 一些压缩器/缩小器甚至可以删除换行符
.test{margin:4px;border:1px solid black;padding:4px}.test{border:1px solid red}
它删除了一个换行符,但留下了一个完全不必要的规则声明.这对我来说似乎很奇怪.
有什么系统可以做到这一点吗？(最好是node.js的附加组件)如果没有,我们知道为什么不呢？看起来像一个相当大的文件大小保存,没有任何缺点.
免责声明我试图寻找组合选择器,合并选择器和少数变体,如果我错过了这个程序的常用术语,请道歉,似乎很可能因为增益看起来很明显我不得不遗漏一些东西!
我不知道选择元素的最佳(最有效)方法是什么.
可以说我有以下布局(非常简单的例子)
<div id="navigation">
<ul>
<li>Link 1</li>
<li>Link 2</li>
<li>Link 3</li>
</ul>
</div>
#navigation ul {}还是为UL分配一个类？navigation ul li{}还是分配课程？#navigation ul li:first-child {}为其设置样式,我应该这样做还是分配一个类？我很欣赏这些问题几乎是一样的,但是我很好奇你何时应该使用一个课程而不是什么时候.
可有人告诉怎么用以下数值混入过渡下列财产.25s与线性放心？
border-top:6px solid#ff3300;
.transition-properties(...) {
@props: ~`"@{arguments}".replace(/[\[\]]/g, '')`;
-webkit-transition-property: @props;
-moz-transition-property: @props;
-o-transition-property: @props;
transition-property: @props;
}
我正在使用jQuery,jQuery Validation和jQuery Autocomplete开发一个网站.我正在开发一个表单,它使用验证来确保一些表单元素有效,自动完成填充文本框,然后AJAX动态替换表单.表单包含几个表单元素,包括一些下拉列表框(...).列表框采用CSS3设计(带有Modernizr以实现向后兼容).
问题出在Internet Explorer上.我正在测试IE9,但我认为它也不适用于IE7或IE8.有两个下拉选择框,两个都出现故障.当用户单击下拉箭头以显示可选选项列表时,只要鼠标在其上移动以进行选择,列表就会消失,就像用户单击鼠标一样(但没有进行选择).
其他说明: -
HTML
<form name="form1" action="#" method="post" id="form1">
<fieldset>
<label for = "radio1">
<input type="radio" id="radio1" name="type" value="1" checked = "checked" />
Sell</label>
<label for = "radio2">
<input type="radio" id="radio2" name="type" value="2" />
Buy</label>
</fieldset>
<label>Address or zipcode</label>
<input name="address" id="address" type="text" size="40" placeholder="Address or zipcode" class="ui-helper-clearfix" />
<label>Second Option</label>
<select name="first_option" id="first_option">
<option value="" disabled="disabled">Select Option</option>
<option value="1">Option 1</option>
<option value="2">Option 2</option>
</select>
<label>Second Option</label>
<select name="second_option" id="second_option"> …到目前为止我有这个(LESS语言):
少:
.test(@name) {
(~".sm-@{name}") {
background: ~"url(../images/icons/sm/@{name}-16x16.png)";
}
}
我可以调用它(.test("facebook"))来生成这样的东西:
CSS:
.sm-facebook {
background: url(../images/icons/sm/facebook-16x16.png);
}
但是,我无法使用常规&运算符将此生成的类定义连接到父选择器.我期待
少:
ul {
li {
&.test("facebook");
}
}
生成
CSS:
ul li.sm-facebook {
background: url(../images/icons/sm/facebook-16x16.png);
}
但我得到一个解析错误.
我怎样才能做到这一点？
我怎么能用SCSS来区分:
#id.class {
color: red;
}
并且:
#id .class{
color: blue
}
因为我需要这样的东西:
#id {
.class {
color: red;
}
' ' + .class {
color: blue;
}
}