首页 > 代码库 > bootstrap_04_列表

bootstrap_04_列表

2024-07-04 02:28:40   226人阅读

<!doctype html>
<html>
<meta charset="utf-8" />
<head>
<title>益司CMS-PC与手机建站集成</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<link rel="stylesheet" href="http://cdn.bootcss.com/twitter-bootstrap/3.0.3/css/bootstrap.min.css">
<!--<link href="http://www.mamicode.com/__PUBLIC__/bootstrap/css/bootstrap-theme.css" rel="stylesheet" />-->
<!--[if It IE 9]>
    <script src="http://www.mamicode.com/http//html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<!--加载jquery-->
<style type="text/css">
@media(max-width:670px){
        body{background:whtie}
    }
</style>
</head>
<body>
<!--
-->
<div class="container">
    <h1 class="page-header">列表
        <small>无序列表，有序列表，描述列表</small>
    </h1>
   
    <h2>
        无序列表
    </h2>
    <ul>
        <li>内容1</li>
        <li>内容2</li>
        <li>内容3</li>
    </ul>
      
    <h2>有序列表</h2>
    <ol>
        <li>内容1</li>
        <li>内容2</li>
        <li>内容3</li>
    </ol>
      
    <h3>描述列表</h3>
    <dl class="dl-horizontal">
        <dt>你是哪里人</dt>
        <dd>你出生在哪里？</dd>
        <dt>程序员</dt>
        <dd>编写代码，实现软件代码，实现软件代码，实现软件代码，实现软件代码，实现软件代码，实现软件代码，实现软件代码，实现软件代码，实现软件代码，实现软件代码，实现软件代码，实现软件功能~</dd>
        <dt>程序程序程序程序程序员</dt>
        <dd>编写代码，实现软件代码，实现软件代码，实现软件代码，实现软件代码，实现软件代码，实现软件代码，实现软件代码，实现软件代码，实现软件代码，实现软件代码，实现软件代码，实现软件代码，实现软件功能~</dd>
    </dl>
</div>
   
<script src="http://cdn.bootcss.com/jquery/1.10.2/jquery.min.js"></script>
<script src="http://cdn.bootcss.com/twitter-bootstrap/3.0.3/js/bootstrap.min.js"></script>
</body>
</html>


联系
我们