有的时候我们copy别人的代码,然后自己修改样式,这时候就会容易犯错误。
比如:
<input class="input1" type="text" name="email" id="email" value="" />
当我们想要新添加一个样式,比如添加一个class form-control
.form-control{ display: block; width: 100%; height: 34px; padding: 6px 12px; font-size: 14px; line-height: 1.42857143; color: #555; background-color: #fff; background-image: none; border: 1px solid #ccc; border-radius: 4px; -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075); box-shadow: inset 0 1px 1px rgba(0,0,0,.075); -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s; -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s; transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s; }
我们可能会这样写
<input class="input1" type="text" name="email" id="email" value="" class="form-control"/>
我们刷新页面的时候,发现页面没有添加form-control.我们不自觉的认为这是缓存,结果却不是,我们这是后就崩溃了,其实问题的原因就是前面有了input1这个class,如果我们想添加class,直接添加到前面那里就行了。。
<input class="input1 form-control" type="text" name="email" id="email" value="" />
最后想说的就是“细节决定成败”,当我们看不出问题的时候,不如重新自己敲打一遍代码,问题就解决了.
Comments are closed.