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>

  • 相关阅读:
    最长回文子串
    学习与提升
    jupyter notebook nginx 试听录音文件,网页试听
    【神经网络】batch、epoch、iteration的含义
    【tensorflow】Tensorflow入门教程
    最全BAT面试题
    打印二叉树
    基于argparser模块实现 ls 功能(基本实现)
    比较详细的argpasrse模块的基本使用
    ini文件转换为Json文件
  • 原文地址:https://www.cnblogs.com/zerogo/p/2209160.html
Copyright © 2011-2022 走看看