Question

好的，所以当我按照方向here开始使用Materialise CSS时，我的输入形式总是如下：

我当前的index.html文件是这样的：

<!DOCTYPE html>
<html>
  <head>
    <title>IRS</title>

    <link href="http://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
    <!--Import materialize.css-->
    <link rel="stylesheet" href="node_modules/materialize-css/css/ghpages-materialize.css">

    <!--Import jQuery before materialize.js-->
    <script type="text/javascript" src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
    <script type="text/javascript" src="node_modules/materialize-css/js/materialize.js"></script>
  </head>

  <body>
    <div class="input-field">
      <input placeholder="Placeholder" id="first_name" type="text" class="validate">
      <label for="first_name">First Name</label>
    </div>
  </body>
</html>

我的电子版本是1.6.6，节点是6.10.3

Answer 1

将“active”类添加到标记并尝试

 <div class="input-field">
          <input placeholder="Placeholder" id="first_name" type="text" class="validate">
          <label for="first_name" class="active">First Name</label>
        </div>

如果您只想要标签动画，请删除<input>标记

的占位符

希望它有效..

Answer 2

对于使用物理化css与电子有问题的其他人，以下是如何让它以正确的方式工作：

<script type="text/javascript" src="js/hammer.min.js"></script>
<script type="text/javascript" src="js/jquery-3.2.1.min.js"></script>
<script type="text/javascript" src="js/materialize.min.js"></script>

问题是materialize.min.js需要hammer.min.js所以你需要将它添加到你的项目并在materilize.min.js之前调用它

MaterializeCSS中电子外观中的所有输入形式都被粉碎

2 个答案: