zoukankan      html  css  js  c++  java
  • Bootstrap与EasyUI入门

    <!DOCTYPE html>
    <html lang="zh-CN">
      <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <!-- 手机自适应 -->
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <!-- 上述3个meta标签*必须*放在最前面,任何其他内容都*必须*跟随其后! -->
        <title>Bootstrap入门</title>
    
        <!-- **Bootstrap**需要的js和css 这都是联网获取的 -->
        <link href="http://libs.baidu.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
    
        <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
    
        <script src="http://libs.baidu.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
    
      </head>
      <body>
      <h1>你好,世界!</h1>
    
        <!-- 这是bootstarp官网的模板 官网地址:http://v3.bootcss.com/css/ -->
     <table class="table table-striped">
      <tr><td>学号</td><td>姓名</td><td>年龄</td><td>性别</td></tr>
      <tr><td>A</td><td>test01</td><td>20</td><td></td></tr>
      <tr><td>B</td><td>柳州</td><td>52</td><td></td></tr>
      <tr><td>C</td><td>张琪</td><td>22</td><td></td></tr>
      <tr><td>D</td><td>五六</td><td>33</td><td></td></tr>
      <tr><td>E</td><td>王五</td><td>44</td><td></td></tr>
      <tr><td>F</td><td>李四</td><td>19</td><td></td></tr>
      <tr><td>G</td><td>张三</td><td>26</td><td></td></tr>
    </table> 
    
      </body>
    </html>

    下面是EasyUI

    <%@ page language="java" contentType="text/html; charset=UTF-8"
        pageEncoding="UTF-8"%>
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>EasyUI入门</title>
    <!--引入EasyUI的js和css-->
    <script language="JavaScript" type="text/javascript"
        src="js/jquery.min.js" charset="utf-8"></script>
    <!--(指定编码方式,防止出现乱码)引入EasyUI中使用的Jquery版本-->
    <script language="JavaScript" type="text/javascript"
        src="js/jquery.easyui.min.js" charset="utf-8"></script>
    <!--(指定编码方式,防止出现乱码)引入EasyUi文件-->
    
    <link rel="stylesheet" type="text/css" href="css/easyui.css">
    <!--引入CSS样式-->
    <link rel="stylesheet" type="text/css" href="css/icon.css">
    <!--Icon引入-->
    
    <script language="JavaScript" type="text/javascript"
        src="js/easyui-lang-zh_CN.js"></script>
    <!--汉化-->
    </head>
    <body>
    <!--官网模本 网址:www.jeasyui.net -->
      <form id="ff" method="post">
        <div>
            <label for="name">Name:</label>
            <input class="easyui-validatebox" type="text" name="name" data-options="required:true" />
        </div>
          <div>
            <label for="name">Pwd:</label>
            <input class="easyui-validatebox" type="password" name="password" data-options="required:true" />
        </div>
        <div>
            <label for="email">Email:</label>
            <input class="easyui-validatebox" type="text" name="email" data-options="validType:'email'" />
        </div>
        ...
    </body>
    </html>

    Bootstrap与EasyUI入门例子路径:http://download.csdn.net/download/xpf_user/10031152

    勿忘初心 得过且过
  • 相关阅读:
    encodeURIComponent与encodeURI的区别
    css实现强制不换行/自动换行/强制换行
    浏览器的visibilitychange 事件ie10以下不兼容
    判断IE版本的语句 [if lte IE 6]...[endif]
    jQueryr .on方法解析
    js判断IE6(推荐方法一)
    JS判断设备终端(PC,iPad,iPhone,android,winPhone)和浏览器
    js判断手机浏览器
    js数字格式化-四舍五入精简版
    jQuery scroll(滚动)延迟加载
  • 原文地址:https://www.cnblogs.com/xpf1009/p/9227308.html
Copyright © 2011-2022 走看看