css怎么做打勾的方框

html-css014

css怎么做打勾的方框,第1张

这个得用Html做的

<form action="" method="get">

您喜欢的水果?<br />

<label><input name="Fruit" type="checkbox" value="0" />苹果 </label>

<label><input name="Fruit" type="checkbox" value="1" />桃子 </label>

<label><input name="Fruit" type="checkbox" value="2" />香蕉 </label>

<label><input name="Fruit" type="checkbox" value="3" />梨 </label>

</form>

在文档里加入复选框就能打勾。

复选框是一种可同时选中多项的基础控件,也是基于计算机语言(C语言、java语言、CSS+HTML超文本标记语言)的编程代码框架,一般控制的方法是按住ctrl键,然后鼠标左击进行点选操作来完成复选多个目标。

(在office2010中,选择“文件”→“选项”→“自定义功能区”→勾选右侧 “开发工具 ”→确定,之后顶上的标签菜单会出现一个 开发工具),会在Word窗口的编辑区左侧出现一个新的工具条,这就是“控件工具箱”,其中有一个按钮是内部有小对勾的方框,用鼠标指向时会出现“复选框”的提示。

点“复选框”按钮,会在Word页面上出现一个叫标有“CheckBox1”的小方框,即“第1复选框”,前面的小方框就是复选框,底纹是灰色,点“控件工具箱”的第一个按钮“退出设计模式”就可以在内部打对勾的,也可以取消对勾。再点“复选框”按钮,会在页面上再出现一个“复选框”标签,叫“CheckBox2”,即“第2复选框”。往下依次类推。

在这些标签上仅仅显示“CheckBox1”和“CheckBox2”肯定是不能满足要求的,要修改这些标签内容。底纹要变为白色,要和文字融为一体。

按下“控件工具箱”第一个按钮,使它处于“设计模式”,点中一个“复选框”,四周会出现八个小圆圈,处于选中状态,点“控件工具箱”第二个按钮,在左侧出现一个“属性”对话框,点“BackColor”项,这是设置背景颜色的,右边的单元格中出现个下拉三角,点击,选中合适的颜色。点“Caption”项,当单元格为蓝色时,右侧的单元格就可以编辑了,输入你需要的文字,WORD的正文中立即就变成了你输入的文字。点“控件工具箱”的第一个按钮“退出设计模式”,试试效果。

希望我能帮助你解疑释惑。

给你个插件吧:http://www.bootcss.com/p/icheck/

原理就是自己做两个checkbox的样式,一个为空一个为选中状态。将原来的默认的checkbox隐藏掉,通过label去控制隐藏掉的checkbox状态。最后通过js判断该隐藏的checkbox状态,从而改变你自定义的checkbox样式。

希望可以帮到你。