Materialise CSS chip用法

物化CSS芯片用于表示少量信息。它们主要用于联系人或标签。
与Materialize CSS芯片一起使用的类
chip:用于将div容器设置为芯片。
例子让我们以一个示例来演示如何使用芯片类来展示如何创建各种类型的标签。

< !DOCTYPE html> < html> < head> < title> The Materialize Chips Example< /title> < meta name = "viewport" content = "width = device-width, initial-scale = 1"> < link rel = "stylesheet" href = "https://fonts.googleapis.com/icon?family=Material+Icons"> < link rel = "stylesheet" href = "https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.3/css/materialize.min.css"> < script type = "text/javascript" src = "https://code.jquery.com/jquery-2.1.1.min.js"> < /script> < script src = "https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.3/js/materialize.min.js"> < /script> < /head> < body class = "container"> < div class = "chip"> < img alt ="HTML5" src ="https://www.srcmini.com/materializecss/images/materialize-chips1.png"> HTML 5 < /div> < div class = "chip"> HTML 5< i class = "material-icons"> close< /i> < /div> < /body> < /html>

【Materialise CSS chip用法】立即测试

    推荐阅读