2021-06-03

最新推荐文章于 2024-08-18 14:02:12 发布

Evergole

最新推荐文章于 2024-08-18 14:02:12 发布

阅读量133

点赞数

分类专栏：新手小白前端文章标签： html css

本文链接：https://blog.csdn.net/qq_51490348/article/details/117534796

版权

前端同时被 2 个专栏收录

3 篇文章 0 订阅

订阅专栏

新手小白

2 篇文章 0 订阅

订阅专栏

css做表格，用css设置颜色，字体，鼠标经过时变换颜色，增加下划线

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        div.zong{
            width: 250px;
        }
        div.jydq{
            background-color: #0f7cbf ;
            font-size: 18px;
            color:white;
            height: 35px;
            text-indent: 5%;
            font-weight: bold;
        }
        div.djdbt{
            background-color:#e4f1fa;
            font-size: 17px;
            text-indent: 10%;
            font-weight: bold;
            height: 30px;
            color: #0f7cbf;
        }
        div.shdqbt{
            background-color:#e4f1fa;
            font-size: 17px;
            text-indent: 10%;
            font-weight: bold;
            height: 30px;
            color: #0f7cbf;
        }
        div.cfdqbt{
            background-color:#e4f1fa;
            font-size: 17px;
            text-indent: 10%;
            font-weight: bold;
            height: 30px;
            color: #0f7cbf;
        }
        div.wjjzbt{
            background-color:#e4f1fa;
            font-size: 17px;
            text-indent: 10%;
            font-weight: bold;
            height: 30px;
            color: #0f7cbf;
        }
        div.djd{
            color: #666;
            height: 75px;
            text-indent: 5%;
        }
        div.shdq{
            color: #666;
            height: 50px;
            text-indent: 5%;
        }
        div.cfdq{
            color: #666;
            height: 50px;
            text-indent: 5%; 
        }
        div.wjjz{
            color: #666;
            height: 50px;
            text-indent: 5%; 
        }
        
        div.djd:hover{
            color: #F60;
            text-decoration:underline;
        }
        div.shdq:hover{
            color: #F60;
            text-decoration:underline;
        }
        div.cfdq:hover{
            color: #F60;
            text-decoration:underline;
        }
        div.wjjz:hover{
            color: #F60;
            text-decoration:underline;
        }

    </style>
</head>
<body>
    <div class="zong">
        <div class="jydq">
            家用电器
        </div>
        <div class="djdbt">
            大家电
        </div>
        <div class="djd">
            平板电视  洗衣机  冰箱 空调  烟机/灶具  热水器 冷柜/酒柜  消毒柜  家庭影院
         </div>
         <div class="shdqbt">
             生活电器
         </div>
         <div class="shdq">
            电风扇  净化器  吸尘器
            净水设备  挂烫机  电话机
          
         </div>
         <div class="cfdqbt">
             厨房电器
         </div>
         <div class="cfdq">
            榨汁机  电压力锅  电饭煲
            豆浆机  微波炉  电磁炉
          
         </div>
         <div class="wjjzbt">
             五金家装
         </div>
         <div class="wjjz">
            淋浴/水槽  电动工具  手动工具
            仪器仪表  浴霸/排气  灯具
          
         </div>

    </div>
</body>
</html>

Evergole

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
2021-06-03

css做表格，用css设置颜色，字体，鼠标经过时变换颜色，增加下划线<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-
复制链接

扫一扫