我有我的属性的handlerbars模板
{{#each claimsHistory}}
<td>
{{lossDate}}
</td>
{{/each}}
Run Code Online (Sandbox Code Playgroud)
lossDate它是我的约会时间,它呈现如下2015-08-28T00:00:00
我想在没有时间的情况下将它显示为2015-08-28.
谢谢
我有一个简单的标记:
<div style="background-color:red;">
<svg>
<circle cx="76" cy="76" r="71"
style="fill:yellow;stroke:purple;stroke-width:10" />
</svg>
</div>
Run Code Online (Sandbox Code Playgroud)
在这里查看 jsfiddle
我无法理解底部圆圈的截断。我想要的只是一个带有完全居中的 SVG 圆的 div。我曾尝试设置框大小和填充,但无济于事。
我有三个圆圈排列并使用百分比。
无论宽度是多少,我都试图让它们周围的边界保持一个完整的圆圈。
CSS 和 HTML:
html, body {
padding: 0;
margin: 0;
}
.container {
width: 100%;
max-width: 700px;
margin-top: 50px;
}
.container div {
font-family: Helvetica;
width: calc(33.333% - 26px);
margin: 0 10px;
display: inline-block;
float: left;
text-align: center;
border: 1px dashed #aaa;
border-radius: 100%;
line-height: 210px;
font-size: 7vw;
}
@media (min-width: 700px) {
.container div {
font-size: 50px;
}
}Run Code Online (Sandbox Code Playgroud)
<div class="container">
<div>8:00</div>
<div>9:30</div>
<div>11:00</div>
</div>Run Code Online (Sandbox Code Playgroud)
我试过使用line-heightand 之类的东西height,但它们都没有响应宽度。
这是一个 Fiddle,因此您可以轻松玩转响应性:
我想要实现的是使背景中的一些div比其余的更慢,以产生视差滚动效果.我发现并修改了这段jQuery代码:
$(window).scroll(function () {
$('.anim').css({
'top': -($(this).scrollTop() / 3) + "px"
});
});
Run Code Online (Sandbox Code Playgroud)
除了一个例外,它的工作正常,我的div有"top:200px",据我所知,第一次滚动它会将top重置为0并且正确地执行它.这是演示,所以你可以看到为什么它看起来不错,不介意"黑色世界"切割,它现在只是一个占位符.当您第一次滚动时,您会注意到"跳转"到顶部:0.反正有没有让它发生?
在使用时max-width为什么它不会"破坏"比允许的更长的单词,我将如何使其工作?
function input() {
var inputText = document.getElementById("inputField").value;
document.getElementById("changingParagraph").innerHTML = inputText;
}Run Code Online (Sandbox Code Playgroud)
#changingParagraph {
max-width: 100px;
}Run Code Online (Sandbox Code Playgroud)
<input type="text" id="inputField" oninput="input()">
<p id="changingParagraph">
</p>Run Code Online (Sandbox Code Playgroud)
我的目标是有 4 个彩色方块,其不透明度间歇性地从 0 变为 1,以显示正在加载某些内容。
我使用 css 动画属性(见下文)来实现这一点 - 但它不起作用!
CSS
animation: opacity 1.5s infinite 200ms
Run Code Online (Sandbox Code Playgroud)
我已经在codepen上实现了它。有人可以告诉我如何修复它吗?
我有桌子
<tbody>
<tr ng-repeat="star in stars">
<td>
<a ng-href="/#/stars/{{star.id}}">{{star.id}}</a>
</td>
<td>{{star.name}}</td>
</tr>
</tbody>
Run Code Online (Sandbox Code Playgroud)
它渲染实体。到目前为止,第一列是可单击的。我想使整个表格行(<tr>)可点击。我该怎么做?
如果选中任何复选框,我想启用该按钮.否则,如果没有选中,我想禁用该按钮.
jQuery的
$(document).ready(function() {
$('.check_list').change(function() {
if ($(".check_list input:checkbox:checked").length > 0){
$(".btn").attr('disabled','disabled');
} else {
$(".btn").removeAttr('disabled');
}
});
});Run Code Online (Sandbox Code Playgroud)
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" class="check_list" name="check_list[]" value="value1">
<input type="checkbox" class="check_list" name="check_list[]" value="value2">
<input type="checkbox" class="check_list" name="check_list[]" value="value3">
<input type="checkbox" class="check_list" name="check_list[]" value="value4">
<button class="btn" disabled> Button</button>Run Code Online (Sandbox Code Playgroud)
检查按钮时它可以工作.但是当我取消选中它仍然启用的所有内容时.但它应该被禁用
这是我想在angularjs中重新创建的有序列表,忽略步骤从0开始的事实,这些将在以后更改为其他内容.
它的来源在这里,数字是由css反增量生成的
HTML
<ul id="progressbar">
<li class="active">Step 0</li>
<li>Step 1</li>
<li>Step 2</li>
<li>Step 3</li>
</ul>
Run Code Online (Sandbox Code Playgroud)
CSS
/*custom font*/
@import url(http://fonts.googleapis.com/css?family=Montserrat);
/*basic reset*/
* {margin: 0; padding: 0;}
html {
height: 100%;
/*Image only BG fallback*/
background: url('gs.png');
/*background = gradient + image pattern combo*/
background:
linear-gradient(rgba(196, 102, 0, 0.2), rgba(155, 89, 182, 0.2)),
url('gs.png');
}
body {
font-family: montserrat, arial, verdana;
background-color: transparent !important;
}
/*form styles*/
#msform {
width: 480px;
margin: 50px auto;
text-align: center;
position: relative;
}
#msform …Run Code Online (Sandbox Code Playgroud)我试图绘制一条水平线约40%的宽度,然后显示一个字体真棒图标,然后再次显示剩下的40%.以下显示了我到目前为止所拥有的内容.但你可以看到https://jsfiddle.net/hyo0ezeo/,它与我描述的任何地方都不相符.有人请指出正确的方法吗?
CSS
h2 {
width: 30%;
text-align: center;
border-bottom: 1px solid red;
line-height: 0.1em;
margin: 10px 0 ;
}
Run Code Online (Sandbox Code Playgroud)
HTML
<div>
<h2>
<span class="fa fa-arrows-alt" aria-hidden="true" style="margin:10px 0"></span>
</h2>
</div>
Run Code Online (Sandbox Code Playgroud)