引导复选框样式

在引导文档中，例如http://getbootstrap.com/css/#forms复选框样式稍微圆润且细微。引导复选框样式

然而，当我引用引导3.3.7 css和使用这个网站

<div class="checkbox"> 
    <label> 
     <input type="checkbox" id="cancelled"> 
     Cancelled 
    </label> 
</div>

我的复选框看起来像标准的HTML丑复选框。

同样可以在这里看到https://codepen.io/mathumatix/pen/dzvQvg。我发现这个问题Why checkbox style is not bootstrap style其中规定Bootstrap 3.x不包括复选框的样式。如果是这样，Bootstrap文档中的复选框如何设计？用自定义CSS没有显示？我也尝试使用Bootstrap 4 alpha，并且我仍然没有在复选框上获得任何样式。我所有其他的UI元素都有Bootstrap风格。我错过了什么？

来源

2017-08-08 Mathumatix

[Customize Bootstrap复选框]的可能重复（https://stackoverflow.com/questions/44279398/customize-bootstrap-checkboxes） –

使您的代码和包括Bootstrap.css的小提琴

它运作良好。也许一些外部代码或浏览器设置正在影响你的CSS。

https://jsfiddle.net/1ca9ufku/

HTML：

<div class="checkbox"> 
    <label> 
     <input type="checkbox" id="cancelled"> 
     Cancelled 
    </label> 
</div>

CSS：

<!-- Latest compiled and minified CSS --> 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

Checkbox

来源

2017-08-08 16:29:55

原来这是浏览器。 Chrome本身带有一个阴影和圆角框，我错误地认为是Bootstrap样式绘制复选框。 IE和Edge绘制广场。我用css找到here使它看起来我想要的。

来源

2017-08-08 17:16:38 Mathumatix

引导复选框样式

回答

相关问题