zoukankan      html  css  js  c++  java
  • 纯CSS仿QQ消息管理器的样式

    <html>
    <head>
    <title> </title>
    <style type="text/css">
    .msgbox { padding:5px; 700px; height:600px; overflow:hidden; margin:100px auto; border:1px solid #83B8DC; background:#fff; }
    .msgbox h1 { color:#3E659F; font-size:14px; border-bottom:1px solid #BBCDDE; height:30px; line-height:30px; padding:0 10px; }
    .msgbox ul { padding:0; margin:10px 0; list-style:none; }
    .msgbox a { color:#333; border:1px solid #fff; display:block; padding:10px 10px 1px 10px; text-decoration:none; }
    .msgbox a:hover { color:#333; border:1px solid #C3DFF4; text-decoration:none; background: #F1FAFE; }
    .msgbox span{display:block;
    color:#4167A7;}
    </style>
    </head>
    <body>
    <div class="msgbox">
    <h1>日期:2008-8-28</h1>

    <ul>
    <li>
    <a href="#"><span>系统消息 11:07:06</span>消息内容消息内容消息内容消息内容消息内容消息内容消息内容</a>
    </li>
    <li>
    <a href="#"><span>系统消息 11:07:06</span>消息内容消息内容消息内容消息内容消息内容消息内容消息内容</a>
    </li>
    <li>
    <a href="#"><span>系统消息 11:07:06</span>消息内容消息内容消息内容消息内容消息内容消息内容消息内容</a>
    </li>
    <li>
    <a href="#"><span>系统消息 11:07:06</span>消息内容消息内容消息内容消息内容消息内容消息内容消息内容</a>
    </li>
    <li>
    <a href="#"><span>系统消息 11:07:06</span>消息内容消息内容消息内容消息内容消息内容消息内容消息内容</a>
    </li>
    <li>
    <a href="#"><span>系统消息 11:07:06</span>消息内容消息内容消息内容消息内容消息内容消息内容消息内容</a>
    </li>
    </ul>
    </div>
    </body>
    </html>

  • 相关阅读:
    [转] Akka实战:构建REST风格的微服务
    [转] Node.js的线程和进程
    [转] Spring Integration 系统集成
    NodeJS使用SSL证书
    Tomcat SSL证书安装配置
    [转]【NODE】用WS模块创建加密的WS服务(WSS)
    [转] Spring Boot实战之Filter实现使用JWT进行接口认证
    [转] 前后端分离之JWT用户认证
    [转] 使用 Java8 Optional 的正确姿势
    [转] SpringBoot RESTful 应用中的异常处理小结
  • 原文地址:https://www.cnblogs.com/zerogo/p/2209160.html
Copyright © 2011-2022 走看看