小编Jac*_*kie的帖子

复选框无法使用materializecss - HTML,CSS

在使用materializecss时,我似乎无法使用复选框,因为其他任何人都遇到了这个问题并设法修复它?

我正在使用的图书馆:

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/css/materialize.min.css">
Run Code Online (Sandbox Code Playgroud)

没有库的复选框 - https://jsfiddle.net/d2yk4sbv/2/

     <div><label> <input type=checkbox> label 1 </label></div>
Run Code Online (Sandbox Code Playgroud)

带库的复选框 - https://jsfiddle.net/d2yk4sbv/

    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/css/materialize.min.css">
            <div><label> <input type=checkbox> label 1 </label></div>
Run Code Online (Sandbox Code Playgroud)

复选框似乎没有库工作正常,但问题是,我的应用程序依赖于使用materializecss所以我不能不使用它:(

链接到materializecss网站 - http://materializecss.com/

html css checkbox materialize

12
推荐指数
3
解决办法
1万
查看次数

在CSS-Grid中创建叠加层

我试图在CSS3网格中创建一个叠加层,但我似乎无法弄清楚如何实现它.我在网上搜索过但没有找到任何帮助.我希望实现如下所示:

在此输入图像描述

body {
  margin: 0;
  padding: 0;
}

.wrapper {
		display: grid;
		grid-template-rows: 1f;
    width: 100vw;
    height: 100vh; 
    grid-template-areas:
      "a"
      "b"
      "c";
	}

.box {
  background-color: #444;
  color: #fff;
}

.a {
  grid-area: a;
}

.b {
  grid-area: b;
}

.c {
  grid-area: c;
}
Run Code Online (Sandbox Code Playgroud)
<div class="wrapper">
  <div class="box a">A</div>
  <div class="box b">B</div>
  <div class="box c">C</div>
</div>
Run Code Online (Sandbox Code Playgroud)

这是一个指向codepen的链接:https://codepen.io/anon/pen/PROVeY

编辑:

如何在CSS3网格布局中将div和左侧和右侧的div叠加在它后面的较大div上 在此输入图像描述

 body {
      margin: 0;
      padding: 0;
    }

    .wrapper {
            display: grid;
            grid-template-rows: 1f;
        width: 100vw;
        height: 100vh; 
        grid-template-areas: …
Run Code Online (Sandbox Code Playgroud)

html css css3 css-grid

5
推荐指数
1
解决办法
2266
查看次数

在 alertifyjs 中设置标题和标签

我使用 alertifyjs 创建了一个自定义确认对话框,并尝试设置标签和标题,但是,我似乎无法同时实现。请有人帮忙。

<html>

<head>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/alertifyjs@1.11.1/build/css/alertify.min.css" />
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/alertifyjs@1.11.1/build/css/themes/bootstrap.min.css" />
  <script src="https://cdn.jsdelivr.net/npm/alertifyjs@1.11.1/build/alertify.min.js"></script>

</head>

<body>

  <div style="display:none;">
    <div id="dlgContent">
      <p> Enter Value One </p>
      <input class="ajs-input" id="inpOne" type="text" value="Input One Default Value" />

      <p> Enter Value Two </p>
      <input class="ajs-input" id="inpTwo" type="text" value="Input two default Value" />

    </div>
  </div>

  <!-- the script  -->

  <script>
    var dlgContentHTML = $('#dlgContent').html();

    $('#dlgContent').html("");
    alertify.confirm(dlgContentHTML).set('onok', function(closeevent, value) {
      var inpOneVal = $('#inpOne').val();
      var inpTwoVal = $('#inpTwo').val();
      //updateListItems(inpOneVal,inpTwoVal);	

      if (inpOneVal == "test" …
Run Code Online (Sandbox Code Playgroud)

javascript jquery alert dialog

2
推荐指数
1
解决办法
4732
查看次数

标签 统计

css ×2

html ×2

alert ×1

checkbox ×1

css-grid ×1

css3 ×1

dialog ×1

javascript ×1

jquery ×1

materialize ×1