用iframe写一个简单的小后台" class="reference-link">用iframe写一个简单的小后台

  1. <html lang="en">
  2. <head>
  3.     <meta charset="UTF-8">
  4.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  5.     <title>网站管理系统</title>
  6. </head>
  7. <style>
  8.     *{margin: 0;padding: 0;}
  9.     a{text-decoration: none;}
  10.     ul,li{list-style-type:none;}
  11.     .header{width: 100%;background-color: #4e6ef2;}
  12.     .main{width: 100%;}
  13.     span{color: #fff;display: inline-block;width:13%;height: 50px;text-align: center;box-sizing: border-box;padding-top: 13px;}
  14.     .left{width: 13%;float: left;}
  15.     .left ul{height: 500px;text-align: center;background-color: cornflowerblue;}
  16.     .left ul li{padding: 10px 0;}
  17.     .left ul li a{cursor:pointer;color: #fff;}
  18.     .left ul li a:hover{color: #000;}
  19.     .right{width: 87%;height: 500px;background-color: lightcyan;float: left;}
  22. </style>
  23. <body>
  24.     <div class="header">
  25.         <span>后台管理系统</span>
  26.     </div>
  27.     <div class="main">
  28.         <div class="left">
  29.             <ul>
  30.                 <li><a href="" target="if">网站系统 </a></li>
  31.                 <li><a href="" target="if">栏目管理</a></li>
  32.                 <li><a href="" target="if">文章管理</a></li>
  33.                 <li><a href="" target="if">插件管理</a></li>
  34.                 <li><a href="biaodan.html" target="if">用户修改</a></li>
  35.             </ul>
  36.         </div>
  38.         <div class="right">
  39.             <iframe srcdoc="网站维护中..." frameborder="0" name="if" width="400" height="300"></iframe>
  40.         </div>
  41.     </div>
  42.     <div class="footer"></div>
  43. </body>
  44. </html>

CSS优先级演示元素样式的四个来源" class="reference-link">CSS优先级演示元素样式的四个来源

  1. <html lang="en">
  2. <head>
  3.     <meta charset="UTF-8">
  4.     <meta http-equiv="X-UA-Compatible" content="IE=edge">
  5.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6.     <title>CSS优先级</title>
  7. </head>
  8. <style>
  9.     div{background-color: burlywood;}
  10.     p[class=zxc]{
  11.         color: chocolate;
  12.     }
  13.     .lxz{
  14.         color: cornflowerblue;
  15.     }
  16.     #name{
  17.         color: rgb(238, 54, 54);
  18.     }
  19.     .qu{
  20.         color: red !important;
  21.     }
  22.     .qu{color: darkmagenta;}
  23. </style>
  24. <body>
  25.     <div>标签选择器</div>
  26.     <p class="zxc">属性选择器</p>
  27.     <p class="zxc qwe">属性选择器</p>
  28.     <p class="zxc">属性选择器</p>
  29.     <p class="lxz">类选择器</p>
  30.     <p id="name">Id选择器</p>
  32.     <div class="qu">!important</div>
  35. </body>
  36. </html>

更多相关文章

  1. sa-admin 一个多窗口后台模板，流畅、易上手、提高生产力
  2. 类声明与实例化、类的静态成员与类的扩展、trait与父类区别联系
  3. 0202面向对象编程基础
  4. PHP类声明|类的实例化|类的静态成员|类的扩展|trait与父类关联|t
  5. 如何让android的service一直在后台运行
  6. Android中定时任务的实现（总结）
  7. 在ubuntu下安装android studio完整版 吐血整理
  8. 如何防止android app被kill
  9. Android(安卓)NDK 开发中 adb logcat 命令的使用

随机推荐

  1. android笔记一 控件属性
  2. Android 时间对象操作工具类
  3. android OnGestureListener滑动事件详解
  4. 新版本Android Souce 编译问题
  5. php、java、android、ios通用的3des方法(
  6. Android 之 发送短信
  7. 初识RatingBar
  8. Android(安卓)EditText 属性汇总
  9. Android实用编程技巧代码总结
  10. 自定义view-制作一个加载中的圆形