Bulma是一个纯粹的CSS框架,没有任何JavaScript代码,最终生成的只是一个简单的.css文件:

Bulma的原则是不直接对标签设置样式,而是通过css类,让开发人员选择是否应用Bulma样式。例如 ,如果不设置css类,是没有Bulma的样式效果的,只有当设置.input css类后才有:。

Bulma只在2种特殊情况下,直接对标签设置样式:

文本内容的样式(如所见即所得):.contentcss类包含的内容

主要的CSS类

Bulma中主要包含了以下几大类的css定义

修饰符

分列

布局

表单

元素

组件

修饰符

可以方便地设置元素的颜色、大小等。

如下面定义了一个按钮,is-primary就是修饰符

Button

分列

水平分列相关的css类。

示例:

First column

Second column

Third column

Fourth column

布局

布局相关的CSS

布局css类 container示例:

This container is centered on desktop.

表单

表单相关css

input 示例:

元素

html元素相关css

Anchor

Button

组件

组件是指由多个元素组成的常用UI单元,如面包屑

面包屑示例:

  • Bulma
  • Documentation
  • Components
  • Breadcrumb

bulma css 中文,Bulma CSS - CSS类相关推荐

  1. PHP中css中文意思是,css中font-family是什么意思

    在css中,font-family的意思为"字体类型.设置字体系列",是用来规定元素的字体系列的属性,可以指定一个元素的字体:该属性可以把多个字体名称作为一个"回退&qu ...

  2. css 中文文字字体_使用CSS的网络字体

    css 中文文字字体 CSS | 网络字体 (CSS | Web fonts) Web fonts allow people to use fonts that are not pre-install ...

  3. 比Bootstrap还好用的CSS 框架 Bulma --教程

    CSS 框架 Bulma 教程 网页样式需要大量时间开发,最省事的方法就是使用 CSS 框架. Bootstrap 是最著名的 CSS 框架,但是今天我想推荐另一个更轻量化.更易用的框架----Bul ...

  4. Bulma - 免费开源的纯 CSS 前端 UI 框架,专注于构建移动优先的响应式 web 界面

    简单易用的 CSS 框架,虽然只有一个 CSS 文件,但功能很强大,在国外很受开发者欢迎,推荐给大家. 关于 Bulma CSS 框架 Bulma 是一个简单.很容易自定义的 CSS UI 框架,提供 ...

  5. html布局文字设置,div css布局中css中文字体设置

    在HTML网页结构中,会用到中文字,而中文字有得多中笔墨体,有的开发者在自身电脑中下载并安装不少摩登字体.而这些中文字体CSS设置装备摆设提倡? 1.不克不及随意CSS设置装备摆设本人安装中笔墨体 假 ...

  6. 页面可用性之浏览器默认字体与CSS中文字体

    一.浏览器默认字体 众所周知,浏览器字体默认的设置为"宋体/simsun字体 16像素",例如Chrome浏览器下: 二.CSS中设置的字体 考虑到兼容性,我们总会在CSS中队字体 ...

  7. css的中文名称是,CSS 中文字体的英文名称

    宋体 SimSun 黑体 SimHei 微软雅黑 Microsoft YaHei 微软正黑体 Microsoft JhengHei 新宋体 NSimSun 新细明体 PMingLiU 细明体 Ming ...

  8. css汉字注释乱码,css font-family属性设置中文字体乱码

    一般设置字体,个人都喜欢用中文,比如:font-family:"微软雅黑":但是偶尔会出现设置以后字体显示乱码的问题 解决方法[1]: 看看你的CSS文件的第一行有没有:@char ...

  9. 网页css样式中英对照,css中文样式(含中英文对照表).doc

    css中文样式(含中英文对照表) CSS学习网站: /css/css_reference.asp / /thread-265-1-1.html 1.[类型]主要针对网页中的文本 [背景]是在网页的元素 ...

  10. html css子标签,HTML+CSS系列:CSS选择器(标签、ID、类、通配符、后代、子元素、并集、伪类)...

    一.标签选择器 Document h1 { color: red; } h2{ color: green; } Hello World! Hello World! Hello ! Hello ! 二. ...

最新文章

  1. [M]MagicTable转换异常解决方法
  2. HDU - 1728 逃离迷宫(bfs)
  3. 计算机基础- -认识磁盘
  4. char data[0]用法总结
  5. @value 静态变量_Java中的变量——通过示例学习Java编程(4)
  6. 网络爬虫--2.HTTP和HTTPS
  7. python并发编程3-进程
  8. 作者:吕红胤,女,电子科技大学副研究员。
  9. 判断用户Input输入的事件来进行登陆
  10. UI设计和UX设计有什么区别?
  11. 〖Linux〗Ubuntu13.10搭建文件共享Samba服务器
  12. vivado2018.3代码编辑界面个性化定制方案
  13. IMX8MQ MEK 开发板安卓 8.1-2.0.0 环境搭建过程记录
  14. java 项目骨架,maven项目中骨架
  15. 小宝精灵-智能语音遥控伴侣(套装版)测评-遥控器的语音时代
  16. 使用XMLSerializer报错java.lang.NoClassDefFoundError: nu/xom/ParentNode
  17. (一)安卓修改屏幕背光默认亮度(framework修改法)
  18. BIOS硬盘模式更改为AHCI模式,及更改后win10蓝屏的解决办法
  19. 小米9 淘宝 618列车加油 脚本 Android10 MIUI11
  20. 简单的汇率转换工具---初试AJAX

热门文章

  1. 电脑插入了U盘却读取不出来的方法
  2. 虚拟机共享文件夹制作|Ubuntu与本机文件共享
  3. antdesign vue 表格,点击某行的事件写法
  4. 从零开始学习UCOSII操作系统15--总结篇
  5. 相片打印机原理_【视界网】什么是便携式打印机以及工作原理有哪些呢?
  6. Pytorch版Lookahead使用及遇到的问题
  7. 一篇经典的 Redis 面试资料「处女座笔记」「吐血推荐」...
  8. flutter设置签名
  9. SWI-Prolog的下载与使用
  10. hihocoder 网易游戏2016实习生招聘在线笔试 解题报告