2018-06-08
客製化 CheckBox 和 Radio Button，以純 CSS 顯示 Twitter Bootstrap 型態風格的 CheckBox 和 Radio Button。
icheck-bootstrap v3.0.1 官方網站
https://github.com/bantikyan/icheck-bootstrap
Licensed under MIT
https://github.com/bantikyan/icheck-bootstrap/blob/master/LICENSE
Demo
https://bantikyan.github.io/icheck-bootstrap/
Code範例
https://github.com/bantikyan/icheck-bootstrap
這和下面網站的 iCheck 是不同的
http://fronteed.com/iCheck
http://icheck.fronteed.com/
http://www.bootcss.com/p/icheck/
Default.aspx 內容
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebApplication1.Default" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <link href="Content/icheck-bootstrap.css" rel="stylesheet" /> </head> <body> <form id="form1" runat="server"> <div> checkbox example <div class="icheck-primary"> <input type="checkbox" id="someCheckboxId" /> <label for="someCheckboxId">Click to check</label> </div> radio buttons example <div class="icheck-primary"> <input type="radio" id="someRadioId1" name="someGroupName" /> <label for="someRadioId1">Option 1</label> </div> <div class="icheck-primary"> <input type="radio" id="someRadioId2" name="someGroupName" /> <label for="someRadioId2">Option 2</label> </div> inline styling <div class="icheck-primary icheck-inline"> <input type="checkbox" id="chb1" /> <label for="chb1">Label 1</label> </div> <div class="icheck-primary icheck-inline"> <input type="checkbox" id="chb2" /> <label for="chb2">Label 2</label> </div> <br /></bt>no label<br /> <div class="icheck-primary"> <input type="checkbox" id="someCheckboxId" /> <label for="someCheckboxId"></label> </div> </div> </form> </body> </html> |
(完)
相關
[研究][CSS] icheck-bootstrap v3.0.1 套件安裝與試用 (NuGet安裝)
http://shaurong.blogspot.com/2018/06/css-icheck-bootstrap-v301-nuget.html
[研究][CSS] iCheck v1.0.2 (在不同流覽器和設備上都有相同的表現) 官方下載、安裝與試用
http://shaurong.blogspot.com/2017/11/css-icheck-v102.html
[研究][CSS] iCheck v1.0.2 (在不同流覽器和設備上都有相同的表現) 安裝與試用 (NuGet安裝)
http://shaurong.blogspot.com/2017/11/css-icheck-v102-nuget.html
[研究][C#][ASP.NET] jQuery 3.2.1 官方下載、安裝、試用
http://shaurong.blogspot.com/2017/11/caspnet-jquery-321.html
jquery插件icheck api使用（美化checkbox和radio样式）
http://www.51xuediannao.com/js/jquery/icheck.html
iCheck表单美化插件使用方法详解（含参数、事件等）
http://www.exp99.com/f2e/iCheck.html
沒有留言:
張貼留言