========绝对响应式 XUI框架========

为降低学习成本,API设计参考Bootstrap,Amaze UI,ZUI,ant.design,Frozen UI等!
xui.css包含文档样式规整,基类,表格,按钮,动画帧等!
xui框架专注PC端WEB UI建设,无栅格类系统!
OPEN SOURCE! TOGETHER!
兼容性测试:IE9+
写在前面的话:请勿定义全局的类,如: .active, .open, .close, .in, .out, .anim, .left, .right, .top, .bottom

h1. XUI heading

h2. XUI heading

h3. XUI heading

h4. XUI heading

h5. XUI heading
h6. XUI heading
max-text
huge-text
large-text
bigger-text
big-text
normal-text
mini-text
tiny-text

引用:<blockquote> A strong man will struggle with the storms of fate.

文本对齐:

text-left

text-center

text-right

text-justify:让文本两边整齐对齐 此外,乐普医疗(300003)公告拟使用自筹资金9500万美元等值的人民币(约6.2亿人民币),与烟台民和德元股权投资管理中心共同投资设立总规模不超过1亿美元的全球精准医疗创新投资基金,首期募集额1100万美元(约7180万人民币)。其中,乐普医疗(300003)拟认购95%,烟台民和拟认购5%。 而睿健医疗已初步搭建了集血液净化相关器械的研发、生产、销售以及血透中心等相关服务为一体的综合型全产业链平台,十分契合乐普医疗(300003)的多元化发展战略。

text-indent:文本缩进2格 此外,乐普医疗(300003)公告拟使用自筹资金9500万美元等值的人民币(约6.2亿人民币),与烟台民和德元股权投资管理中心共同投资设立总规模不超过1亿美元的全球精准医疗创新投资基金,首期募集额1100万美元(约7180万人民币)。

text-lowercase: 英文文本转小写

text-uppercase: 英文文本转大写

text-capitalize: 英文首字母大写

text-ellipsis:文本单行显示,溢出并以省略号 而睿健医疗已初步搭建了集血液净化相关器械的研发、生产、销售以及血透中心等相关服务为一体的综合型全产业链平台,十分契合乐普医疗(300003)的多元化发展战略。

word-break-all:断行数字或英文单词 0000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000

mark Tag : highlight

del Tag : 删除线标签

ins Tag : 下划线标签

small Tag : 小号文本

abbr Tag : 强调属性attr

code Tag : <section>

kbd Tag : ctrl + r

.pr : 相对定位

.pa : 绝对定位

.cf : 清浮动

.fl : 左浮动

.fr : 右浮动

.blod : 加粗

.overflow-hidden : 溢出隐藏

.show : 显示隐藏的元素Show this

.hidden : 隐藏显示的元素

.invisible : 透明元素

.badge:100 徽章

飘在半空中的文本 (垂直居中 .text-center-vertical)
飘在半空中的文本 (水平+垂直居中 .text-center .text-center-vertical)
dt小标题
dd内容
dd内容
一个漂亮的标题
ID First Name Last Name Username
1 Mark Otto @mdo
2 Jacob Thornton @fat
3 Larry the Bird @twitter
一个漂亮的标题
ID First Name Last Name Username
1 Mark Otto @mdo
2 Jacob Thornton @fat
3 Larry the Bird @twitter
一个漂亮的标题
ID First Name Last Name Username
1 Mark Otto @mdo
2 Jacob Thornton @fat
3 Larry the Bird @twitter
自动刷新:
桌面通知:
大开关:

按钮及按钮组:

无焦点元素 1 2 3 4 down

进度条:

big 60%
sm 40%
xs 30%

步进:

1.选择商品
2.确认订单
3.支付订单
4.交易结果

radio变形:

面包屑导航:

星星:

字体图标:

  1. icon-search

  2. icon-user

  3. icon-news

  4. icon-stock

  5. icon-set

  6. icon-notification

  7. icon-school

  8. icon-home

  9. icon-workbench

  10. icon-save

  11. icon-filter

  12. icon-service

  13. icon-totop

  14. icon-wechat

  15. icon-phone-download

  16. icon-arrow-right

  17. icon-arrow-left

  18. icon-arrow-down

  19. icon-arrow-up

  20. icon-fire

  21. icon-eye

  22. icon-paper

  23. icon-phone

  24. icon-sms

  25. icon-shield

  26. icon-password

  27. icon-chevron-up

  28. icon-chevron-down

  29. icon-chevron-left

  30. icon-chevron-right

  31. icon-question

  32. icon-plus

  33. icon-check

  34. icon-date

  35. icon-eye-dark

  36. icon-fire-dark

  37. icon-close-dark

  38. icon-account

  39. icon-gold-heap

  40. icon-set-dark

  41. icon-task

  42. icon-dustbin

  43. icon-triangle-left

  44. icon-triangle-top

  45. icon-triangle-bottom

  46. icon-triangle-right

  47. icon-wechat-dark

  48. icon-sina

  49. icon-new-window

  50. icon-warn

  51. icon-empty-box

  52. icon-star

  53. icon-star-half

  54. icon-star-empty

  55. icon-add

  56. icon-comment

  57. icon-pie

  58. icon-feature-server

  59. icon-new-economy

  60. icon-gift

  61. icon-commodity

  62. icon-tag

  63. icon-desc

  64. icon-asc

  65. icon-movedown

  66. icon-moveup

  67. icon-pen

  68. icon-relate

  69. icon-drag-verticle

  70. icon-drag-horizontal

DOM加载类:.loading-page

============JS组件:============

模拟placeholder输入框,兼容ie9:

请输入11位手机号码

表单组:

请输入密码

图片验证码错误

下拉菜单:

工具提示:

选项卡:

  • 沪深A股
  • 上海A股
  • 深圳A股
【青春】那时候有多好,任雨打湿裙角。忍不住哼起,心爱的旋律。绿油油的树叶,自由地在说笑。燕子忙归巢,风铃在舞蹈。经过青春的草地,彩虹忽然升起。即使视线渐渐模糊,它也在我心里。就像爱过的旋律,没人能抹去。因为生命存在失望,歌唱,所以才要歌唱。
【彩虹】那时候有多好,任雨打湿裙角。忍不住哼起,心爱的旋律。绿油油的树叶,自由地在说笑。燕子忙归巢,风铃在舞蹈。经过青春的草地,彩虹忽然升起。即使视线渐渐模糊,它也在我心里。就像爱过的旋律,没人能抹去。因为生命存在失望,歌唱,所以才要歌唱。
【歌唱】那时候有多好,任雨打湿裙角。忍不住哼起,心爱的旋律。绿油油的树叶,自由地在说笑。燕子忙归巢,风铃在舞蹈。经过青春的草地,彩虹忽然升起。即使视线渐渐模糊,它也在我心里。就像爱过的旋律,没人能抹去。因为生命存在失望,歌唱,所以才要歌唱。
【青春】那时候有多好,任雨打湿裙角。忍不住哼起,心爱的旋律。绿油油的树叶,自由地在说笑。燕子忙归巢,风铃在舞蹈。经过青春的草地,彩虹忽然升起。即使视线渐渐模糊,它也在我心里。就像爱过的旋律,没人能抹去。因为生命存在失望。
【彩虹】那时候有多好,任雨打湿裙角。忍不住哼起,心爱的旋律。绿油油的树叶,自由地在说笑。燕子忙归巢,风铃在舞蹈。经过青春的草地,彩虹忽然升起。即使视线渐渐模糊,它也在我心里。就像爱过的旋律,没人能抹去。因为生命存在失望,歌唱,所以才要歌唱。

弹出层:

模态框:同bootstrap一样需要把模态框html代码片段放在页面

轮播图:

按钮waiting:

注 册 登 录 加载更多

日历calendar:

声音提醒audio:

点我声音提醒

桌面提示notification:

点我桌面提示

本地存储:

点我永久存储info: {name: 'barrior', age: 23} 点我临时存储sex: 'male'

通用日历$().calendarCom():