标签: materialize

是否可以手动在表单字段上设置验证错误颜色？我无法弄清楚它是如何在他们的网站上进行验证的.似乎浏览器正在根据type属性自动执行此操作.但是我需要附加哪些CSS才能触发该状态？我需要在文本字段上进行自定义验证,而浏览器自动执行验证是不够的.

我有一个Materialize输入，如下所示：

<input type="date" className="datepicker" onChange={this.props.handleChange} />

它已由Materialize正确初始化，但在日期选择器的值更改时不会触发onChange。我在这里做错了什么？这个问题似乎扩展到所有实现输入。

我是HTML和CSS的新手，无法弄清楚如何更改http://materializecss.com/footer.html上的页脚颜色。任何帮助都会很棒，谢谢！

我正在尝试在Material Design中创建我的网站,但无论我是使用MDB(Material Design for Bootstrap)还是Materialize CSS框架,我都发现了Material Select的一个问题.两者在Windows/OSX/Android上运行良好,但出于某种原因,当我在iPad上打开Material Select组件并单击它时,有一个闪烁的光标显示在Dropdown的背景中.

我正在使用webpack作为我的捆绑器/加载器,我可以在fine(js/css)中加载materialize css,但是当我尝试使用toast时,它说

Uncaught TypeError: Vel is not a function

我将库包含在主index.js文件中:

import 'materialize-css/bin/materialize.css' import 'materialize-css/bin/materialize.js'

有谁知道为什么会发生这种情况？查看捆绑的源,实现的js就在那里.

的缺省宽度container被设定为70%的MaterializeCSS:

容器类不是网格的严格组成部分,但在布局内容时很重要.它允许您将页面内容居中.容器类设置为窗口宽度的~70%.它可以帮助您集中和包含您的页面内容.我们使用容器来包含我们的身体内容.

怎么会改变？

我尝试添加自定义CSS，但是没有用。选择输入字段后，我需要更改文本的颜色。

<div class="input-field form-group">
    <input id="first_name" class="active validate form-control" name="first_name" type="text" value="">
    <label for="first_name" class="mat-label">First Name</label>
</div>

我正在使用materializecss v.1.0.0(beta),我试图只导入按钮组件.对于scss文件我没有问题,但对于js文件我有一些问题.

我已经导入了以下文件:

import Cash from 'materialize-css/js/cash';
import Component from 'materialize-css/js/component';
import Global from 'materialize-css/js/global';
import Materialize from 'materialize-css/js/buttons';

但是不正确,因为每个都没有使用import和export语句构建,而按钮js找不到Global Component.

我怎样才能导入特定的materialize组件而不是所有的js库？

我正在尝试为移动网页创建一个侧边栏菜单。我的目标是从 25% 的屏幕左边缘滑出侧边栏。

Materialise 框架 Sidenav中使用了类似的方式

#drag-target用于接收拖动事件和滑出侧边栏。问题是#drag-target覆盖了部分内容并阻止了底层元素上的点击/触摸事件。

我使用了 CSS 规则pointer-events: none，但这会破坏元素本身的滑动。

除了滑动/拖动之外，有什么方法可以通过#drag-target所有底层元素传递触摸/单击事件？

我正在尝试使用将这些图标对齐为一行，className="col s1"但是当我运行此代码时，由于某种原因它显示在列中。我尝试删除容器标签，添加它，尝试更改列大小，但由于某种原因它始终显示为列而不是行。

有什么办法可以让它发挥作用吗？

这是代码的链接：项目

主.jsx

import React, { useState, useEffect, useRef } from "react";
import Helmet from "react-helmet";
import Socials from "./Socials";
function Main(props) {
  const socialMedia = [
    {
      link: "https://www.linkedin.com/in/",
      icon: "linkedin"
    },
    {
      link: "https://github.com/",
      icon: "github"
    },
    {
      link: "https://www.youtube.com/",
      icon: "youtube"
    },
    {
      link:
        "mailto:example@ex.co?subject=Felipe%20GD%20--%20Request%20To%20Contact",
      icon: "email"
    }
  ];

  return (
    <React.Fragment>
      <Helmet>
        <title>Felipe GD</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
      </Helmet>
      <div className="container">
        <div clasName="row">
          {socialMedia.map((socials) => (
            <Socials
              getOpacity={null}
              getVisibility={null}
              link={socials.link} …