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>

  • 相关阅读:
    Eclipse中一个Web项目引用另一个项目中的类
    android adb shell中使用到的命令
    移动端服务器i-jetty下载编译安装及问题解决系列
    Windows和Ubuntu双系统独立分区安装的方法
    Mina2.0框架源码剖析(三)
    Mina2.0框架源码剖析(二)
    Mina2.0框架源码剖析(一)
    JBoss
    J2EE的体系结构
    微博三方登录
  • 原文地址:https://www.cnblogs.com/zerogo/p/2209160.html
Copyright © 2011-2022 走看看