Home Explore Information Event License
Tool
软件代码质量检测云服务 持续集成与部署云服务 社区个性化内容推荐服务 贡献审阅人推荐服务 群体化学习服务 重睛鸟代码扫描工具
Watch 1 Star 0 Fork 61

Java编程思想/Light Year Admin Using Iframe v5

forked from 笔下光年/Light Year Admin Using Iframe v5 
Code Issues 0 Pull Requests 0 Wiki 0 Insights
Create your Gitee Account
Explore and code with more than 12 million developers，Free private repositories ！：）
Sign up
文件
Clone or Download
lyear_utilities_borders.html 6.52 KB
Copy Edit Raw Blame History
笔下光年 authored 2022-11-01 21:00 . 提交代码
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132
<!DOCTYPE html>

<html lang="zh">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<meta http-equiv="X-UA-Compatible" content="IE=edge">

<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimal-ui">

<meta name="keywords" content="LightYear,LightYearAdmin,光年,后台模板,后台管理系统,光年HTML模板">

<meta name="description" content="Light Year Admin V5是一个基于Bootstrap v5.1.3的后台管理系统的HTML模板。">

<title>边框 - 光年(Light Year Admin V5)后台管理系统模板</title>

<link rel="shortcut icon" type="image/x-icon" href="favicon.ico">

<meta name="apple-mobile-web-app-capable" content="yes">

<meta name="apple-touch-fullscreen" content="yes">

<meta name="apple-mobile-web-app-status-bar-style" content="default">

<link rel="stylesheet" type="text/css" href="css/materialdesignicons.min.css">

<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">

<link rel="stylesheet" type="text/css" href="css/style.min.css">

</head>

  

<body>

<div class="container-fluid">

  

  <div class="row">

    

    <div class="col-lg-12">

      <div class="card">

        <header class="card-header"><div class="card-title">边框</div></header>

        <div class="card-body">

          

          <p>使用边框类添加或删除元素的边框。从所有边框中选择，或者一次选择一个。</p>

          <h6>增加的</h6>

          <div class="border-example border-example-border-utils">

            <span class="border"></span>

            <span class="border-top"></span>

            <span class="border-end"></span>

            <span class="border-bottom"></span>

            <span class="border-start"></span>

          </div>

          <pre>&lt;span class="border"&gt;&lt;/span&gt;

&lt;span class="border-top"&gt;&lt;/span&gt;

&lt;span class="border-end"&gt;&lt;/span&gt;

&lt;span class="border-bottom"&gt;&lt;/span&gt;

&lt;span class="border-start"&gt;&lt;/span&gt;</pre>

          <h6>删减的</h6>

          <div class="border-example border-example-border-utils border-example-border-utils-0">

            <span class="border-0"></span>

            <span class="border-top-0"></span>

            <span class="border-end-0"></span>

            <span class="border-bottom-0"></span>

            <span class="border-start-0"></span>

          </div>

          <pre>&lt;span class="border-0"&gt;&lt;/span&gt;

&lt;span class="border-top-0"&gt;&lt;/span&gt;

&lt;span class="border-end-0"&gt;&lt;/span&gt;

&lt;span class="border-bottom-0"&gt;&lt;/span&gt;

&lt;span class="border-start-0"&gt;&lt;/span&gt;</pre>

          <h6>边框颜色</h6>

          <p>使用基于主题颜色构建的类更改边框颜色。</p>

          <div class="border-example border-example-border-utils">

            <span class="border border-primary"></span>

            <span class="border border-secondary"></span>

            <span class="border border-success"></span>

            <span class="border border-danger"></span>

            <span class="border border-warning"></span>

            <span class="border border-info"></span>

            <span class="border border-light"></span>

            <span class="border border-dark"></span>

            <span class="border border-white"></span>

          </div>

          <pre>&lt;span class="border border-primary"&gt;&lt;/span&gt;

&lt;span class="border border-secondary"&gt;&lt;/span&gt;

&lt;span class="border border-success"&gt;&lt;/span&gt;

&lt;span class="border border-danger"&gt;&lt;/span&gt;

&lt;span class="border border-warning"&gt;&lt;/span&gt;

&lt;span class="border border-info"&gt;&lt;/span&gt;

&lt;span class="border border-light"&gt;&lt;/span&gt;

&lt;span class="border border-dark"&gt;&lt;/span&gt;

&lt;span class="border border-white"&gt;&lt;/span&gt;</pre>

          <h6>边框宽度</h6>

          <div class="border-example border-example-border-utils">

            <span class="border border-1"></span>

            <span class="border border-2"></span>

            <span class="border border-3"></span>

            <span class="border border-4"></span>

            <span class="border border-5"></span>

          </div>

          <pre>&lt;span class="border border-1"&gt;&lt;/span&gt;

&lt;span class="border border-2"&gt;&lt;/span&gt;

&lt;span class="border border-3"&gt;&lt;/span&gt;

&lt;span class="border border-4"&gt;&lt;/span&gt;

&lt;span class="border border-5"&gt;&lt;/span&gt;</pre>

          <h6>边框圆角</h6>

          <div class="border-example border-example-border-utils">

            <img src="images/img-placeholder.png" width="75" alt="..." class="rounded">

            <img src="images/img-placeholder.png" width="75" alt="..." class="rounded-top">

            <img src="images/img-placeholder.png" width="75" alt="..." class="rounded-end">

            <img src="images/img-placeholder.png" width="75" alt="..." class="rounded-bottom">

            <img src="images/img-placeholder.png" width="75" alt="..." class="rounded-start">

            <img src="images/img-placeholder.png" width="75" alt="..." class="rounded-circle">

            <img src="images/img-placeholder.png" width="150" height="75" alt="..." class="rounded-pill">

          </div>

          <pre>&lt;img src="..." alt="..." class="rounded"&gt;

&lt;img src="..." alt="..." class="rounded-top"&gt;

&lt;img src="..." alt="..." class="rounded-right"&gt;

&lt;img src="..." alt="..." class="rounded-bottom"&gt;

&lt;img src="..." alt="..." class="rounded-left"&gt;

&lt;img src="..." alt="..." class="rounded-circle"&gt;

&lt;img src="..." alt="..." class="rounded-pill"&gt;</pre>

          <h6>尺寸</h6>

          <div class="border-example border-example-border-utils">

            <img src="images/img-placeholder.png" width="75" alt="..." class="rounded-0">

            <img src="images/img-placeholder.png" width="75" alt="..." class="rounded-1">

            <img src="images/img-placeholder.png" width="75" alt="..." class="rounded-2">

            <img src="images/img-placeholder.png" width="75" alt="..." class="rounded-3">

          </div>

          <pre>&lt;img src="..." alt="..." class="rounded-0"&gt;

&lt;img src="..." alt="..." class="rounded-1"&gt;

&lt;img src="..." alt="..." class="rounded-2"&gt;

&lt;img src="..." alt="..." class="rounded-3"&gt;</pre>

          

        </div>

      </div>

    </div>

        

  </div>

  

</div>

<script type="text/javascript" src="js/jquery.min.js"></script>

<script type="text/javascript" src="js/popper.min.js"></script>

<script type="text/javascript" src="js/bootstrap.min.js"></script>

<script type="text/javascript" src="js/main.min.js"></script>

</body>

</html>
Loading...
马建仓 AI 助手
尝试更多
代码解读
代码找茬
代码优化