1)什么是Materialized CSS?
Materialize CSS是一个包含库文件的CSS框架。它是使用CSS, JavaScript和HTML创建的。它用于创建有吸引力, 可靠且功能强大的网页和网络应用程序。
2)Materialize CSS何时发布?
物化CSS于2015年11月8日发布。
3)Materialize CSS的显着特征是什么?
以下是Materialize CSS的一些重要功能:
- 它包含内置的响应式设计。
- 它以最小的占用空间提供了标准CSS。
- 它提供了新版本的通用用户界面控件, 例如按钮, 复选框和适用于” 材料设计” 概念的文本字段。
- 它促进了增强和专门的功能, 例如卡, 标签, 导航栏, 祝酒等。
- 它是免费使用的, 并且需要jQuery JavaScript库才能正常运行。
- 它是跨浏览器支持的, 可用于创建可重用的Web组件。
有两种使用Materialize CSS的方法:
本地安装:通过在我们的本地计算机上下载materialize.min.css和materialize.min.js文件并将它们包含在你的HTML代码中来实现。
基于CDN的版本:通过直接从内容交付网络(CDN)将materialize.min.css和materialize.min.js文件包含到我们的HTML代码中。
5)Materialize CSS中有哪些不同的Utility类?
Materialize CSS中不同实用程序类的列表:
颜色实用程序类:示例:.red, .green, .grey等。
对齐实用程序类:示例:.valign-wrapper, .left-align, .right-align, .center-align, .left, .right等。
根据设备大小隐藏Content实用程序类:示例:.hide, .hide-on-small-only, .hide-on-med-only等。
格式化实用程序类:示例:截断, 可悬停等。
6)在Materialize CSS中使用哪些类创建响应式图像和视频?
在Materialize CSS中用于创建响应式图像和视频的类的列表:
sensitive-img:此类用于创建响应图像。
video-container:此类用于创建响应式容器。那已经嵌入了视频。
响应视频:此类用于创建响应式HTML5视频。
7)Materialize CSS中的表有哪些不同的类?
Materialize CSS中不同类别的表格:
Index | 班级名称 | Description |
---|---|---|
1) | none | 它用于表示没有任何边界的基本表。 |
2) | stripped | 它用于显示剥离表。 |
3) | bordered | 用于在表格中创建边框。 |
4) | highlight | 它用于突出显示表格。 |
5) | centered | 它用于创建居中对齐的所有文本。 |
6) | responsive-table | 它用于创建响应表。 |
徽章是用于提供屏幕通知的组件。它可以是数字或图标。它用来强调项目的数量。
在Materialize CSS中使用了以下徽章类别:
- badge:将元素标识为MDL Badge组件。
- new:用于向徽章组件添加新类。
Materialize CSS为BreadCrumb提供了两个类:
- nav-wrapper:用于将nav组件设置为面包屑/导航栏包装器。
- 面包屑:用于将锚点元素设置为面包屑。
Chip是Materialize CSS的组件, 它像标签一样代表一小部分信息。
11)Materialize CSS中的集合是什么?还指定集合的??类。
集合是一组具有相关信息的项目。以下是Materialize CSS中的收集类的列表:
Index | Collection class | Description |
---|---|---|
1) | collection | 用于将div或ul容器设置为集合。 |
2) | collection-item | 用于将a或li项目设置为收集项目。 |
3) | active | 它将a或li项目显示为活动收集项目。 |
4) | with-header | 它用于标记集合具有标题。 |
5) | collection-header | 它是将a或li项目设置为集合标头的集合。 |
6) | avatar | 它是将a或li项目设置为头像项目。 |
7) | dismissible | 它使收集项目被刷掉。它仅适用于触摸屏设备。 |
你可以使用分页类在Materialize CSS中创建分页。此类与ul元素一起使用。
例:
<
ul class="pagination">
<
li class="disabled">
<
a href="http://www.srcmini.com/#!">
<
i class="material-icons">
chevron_left<
/i>
<
/a>
<
/li>
<
li class="active">
<
a href="http://www.srcmini.com/#!">
1<
/a>
<
/li>
<
li class="waves-effect">
<
a href="http://www.srcmini.com/#!">
2<
/a>
<
/li>
<
li class="waves-effect">
<
a href="http://www.srcmini.com/#!">
3<
/a>
<
/li>
<
li class="waves-effect">
<
a href="http://www.srcmini.com/#!">
4<
/a>
<
/li>
<
li class="waves-effect">
<
a href="http://www.srcmini.com/#!">
5<
/a>
<
/li>
<
li class="waves-effect">
<
a href="http://www.srcmini.com/#!">
<
i class="material-icons">
chevron_right<
/i>
<
/a>
<
/li>
<
/ul>
13)Materialize CSS中的下拉菜单是什么?
【Materialise CSS面试题】在Materialize CSS中有两种类型的下拉类:
- dropdown-content:将< u> HTML标记标识为实现下拉组件。
- 数据激活:它是下拉ul元素的ID。
推荐阅读
- Materialise CSS可折叠
- Materialise CSS预加载器(进度栏)
- Materialise CSS轮播
- Materialise CSS分页
- Materialise CSS导航栏
- Materialise CSS图标
- appium安卓自动化常见问题处理
- Java + Selenium + Appium手机自动化测试
- MyBatis小问题-Mapper中错误No constructor found...