Layui 使用方法 icon

luyanran
713 阅读1分钟
  1. 创建一个项目
  2. 新建一个文件夹在项目中用来存放下载好的layui
  3. 新建一个页面
  4. 使用

  • link引入css样式：

     ./layui/css/layui.css

  • 引入script标签

  •      <script src="../layui/layui.js"></script>

图标的使用 两种

www.layui.com/doc/element…

  •      方法一 
     使用字符实体+layui-icon
     layui-icon 必须要给不然没有样式代表layui图标处理样式

  •      &nbsp;   .....
     &#xe68f; 直接写什么都没有，需要加一个任何一个容器标签，可以在标签里面放东西的标签及双标签，单标签不行，需要加入class类ui             layui-icon  
     eg： <span id="" class="layui-icon">
            	&#xe68f;
       	</span>
  注意 想直接显示标签直接用 &amp;#xe68f;
举例
      <!DOCTYPE html>
     <html>
<head>
	<meta charset="utf-8" />
	<title>图标的使用</title>
</head>
<link rel="stylesheet" type="text/css" href="source/layui/css/layui.css"/>
<body>
	<span id="" class="layui-icon">
		&#xe68f;
	</span>
	&amp;#xe68f;
	<input type="text" id="" value="&amp;#xe68f;" />
	<script src="source/layui/layui.js" type="text/javascript" charset="utf-8"></script>	   
</body>

  •        方法二  
       直接都是样式 layui-icon layui-icon-heart 两个
   代码   
     <span id="" class="layui-icon layui-icon-heart"></span>
举例
       <!DOCTYPE html>
    <html>
    	<head>
	<meta charset="utf-8" />
	<title>图标的使用</title>
</head>
<link rel="stylesheet" type="text/css" href="source/layui/css/layui.css"/>
<body>
	<span id="" class="layui-icon layui-icon-heart">
	</span>
    	&amp;#xe68f;
    	<input type="text" id="" value="&amp;#xe68f;" />
	<script src="source/layui/layui.js" type="text/javascript" charset="utf-8"></script>	   
    	</body>
    </html>

内置图标抠页面

页面直接检查查看到原码 将div全都复制粘贴记住加一个样式类样式 .site三个样式类样式加入过去

avatar
文章
阅读
粉丝