html-6.3

最新推荐文章于 2023-06-27 21:37:18 发布
最新推荐文章于 2023-06-27 21:37:18 发布
阅读量208 收藏
点赞数 1
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_58826255/article/details/117532151
版权 
<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>家用电器分类</title>
    <style type="text/css">
        .box {
            width: 260px;
        }
        
        .box1 {
            position: absolute;
            margin-left: -40px;
            margin-top: -2.6%;
            width: 300px;
        }
        
        .box h2 {
            font-size: 20px;
            color: #fff;
            line-height: 35px;
            background: linear-gradient(to bottom, #0467AC, #63A7D6, #B6DBF5);
            text-indent: 1em;
        }
        
        .box ul li {
            list-style-type: none;
            font-size: 0;
        }
        
        span {
            font-size: 12px;
        }
        
        .box ul li h3 {
            font-size: 14px;
            line-height: 30px;
            background: linear-gradient(to top, #CEE7F9, #BDDFF7, #CEE7F9);
        }
        
        .box ul li h3 a {
            text-decoration: none;
            color: #0565C6;
        }
        
        .box ul li h3 a:hover {
            text-decoration: underline;
        }
        
        .box ul li p {
            font-size: 12px;
            line-height: 26px;
        }
        
        .box ul li p a {
            color: #666;
            text-decoration: none;
        }
        
        .box ul li p a:hover {
            color: #F60;
            text-decoration: underline;
        }
    </style>
</head>

<body>
    <div class="box">
        <h2>家用电器</h2>
        <div class="box1">
            <ul>
                <li>
                    <h3><a href="#">大家电</a></h3>
                    <p>
                        <a href="#">平板电视</a>
                        <a href="#">洗衣机</a>
                        <a href="#">冰箱</a>
                    </p>
                    <p>
                        <a href="#">空调</a>
                        <a href="#">烟机</a>
                        <span>/</span>
                        <a href="#">灶具</a>
                        <a href="#">热水器</a>
                    </p>
                    <p>
                        <a href="#">冷柜</a>
                        <span>/</span>
                        <a href="#">酒柜</a>
                        <a href="#">消毒柜</a>
                        <a href="#">家庭影院</a>
                    </p>
                </li>
                <li>
                    <h3><a href="#">生活电器</a></h3>
                    <p>
                        <a href="#">电风扇</a>
                        <a href="#">净化器</a>
                        <a href="#">吸尘器</a>
                    </p>
                    <p>
                        <a href="#">净水设备</a>
                        <a href="#">挂烫机</a>
                        <a href="#">电话机</a>
                    </p>
                </li>
                <li>
                    <h3><a href="#">厨房电器</a></h3>
                    <p>
                        <a href="#">榨汁机</a>
                        <a href="#">电压力锅</a>
                        <a href="#">电饭煲</a>
                    </p>
                    <p>
                        <a href="#">豆浆机</a>
                        <a href="#">微波炉</a>
                        <a href="#">电磁炉</a>
                    </p>
                </li>
                <li>
                    <h3><a href="#">五金家装</a></h3>
                    <p>
                        <a href="#">淋浴</a>
                        <span>/</span>
                        <a href="#">水槽</a>
                        <a href="#">电动工具</a>
                        <a href="#">手动工具</a>
                    </p>
                    <p>
                        <a href="#">仪器仪表</a>
                        <a href="#">浴霸</a>
                        <span>/</span>
                        <a href="#">排气</a>
                        <a href="#">灯具</a>
                    </p>
                </li>
            </ul>
        </div>
    </div>
</body>

</html>

运行结果如下图所示：

 

1：内联式css样式
内联式css样式表就是把css代码直接写在现有的HTML标签中:

采用style属性。范围只针对此标签适用。

该方式比较灵活，但是对于多个相同标签的同一样式定义比较麻烦，适合局部修改。

2：嵌入式css样式
在HTML文档中的< head >中使用< style >标记，，被称为内嵌式。

在head标签中加入< style >标签，对多个标签进行统一修改，范围针对此页面。

 

yohooJoker
关注
1_6.1-6.3.zip
06-02
很抱歉，根据您提供的信息，"1_6.1-6.3.zip"是一个压缩包文件，但没有具体的描述或标签来指示它包含的具体IT知识点。通常，这种命名可能表示该压缩包包含了某个课程或教程的第6.1至6.3部分的内容。然而，由于没有...
html接入海康视频数据
热门推荐
zhangchaoming123的博客
08-16 1万+
因本人项目原因，需要前端显示海康视频进行实时监控，其中遇到了些许问题，特整理此文档以帮助后人，勿谢伙计。 1.安装vlc播放器,一直下一步即可； 2.获取海康rstp视频流，例如：rtsp://zhangchaoming:zhangchaoming/192.168.0.2/MPEG-4/ch1/main/av_stream; 3.html插入<object type='application/
QT Ubuntu18安装qt+vtk-6.3
做减求空
07-01 2422
Ubuntu18安装qt+vtk-6.31.Qt5.1.0安装2.vtk6.3安装2.1 下载2.2 build and make2.3 配置QT3.QT+VTK试运行3.1 新建工程，配置头文件和库的路径3.2 拖入一个VTK控件(我创建的是带窗体的工程)3.3 编译、运行、显示如下：4.问题总结5.参考链接5.1 安装5.2 使用 1.Qt5.1.0安装 Qt下载地址：http://download.qt.io/ 我的版本：https://download.qt.io/archive/qt/5.1/5
c语言readline库6,6.35. Readline-6.3
weixin_33437453的博客
05-25 407
6.35.1. 安装 Readline首先安装补丁修复一些上游标记的 bug：patch -Np1 -i ../readline-6.3-upstream_fixes-3.patch重装 Readline 会使旧的库移动到 .old。通常来说这并不是什么问题，但一些情况下可能引起ldconfig 链接错误。可以通过下面的两个 sed 命令避免这个问题：sed -i '/MV.*old/d' Mak...
jboss-eap-6.3集成OracleDS和MySqlDS配置
李坤 大米时代 第五期
12-06 5570
jboss-eap-6.3集成OracleDS和MySqlDS
如何在Ubuntu上安装gcc-6.3
weixin_30698527的博客
09-06 581
装显卡驱动推荐 gcc 6.3 版本，其实linux上多个版本的gcc是可以共存的，需要的的时候切换就好,参加之前的博客 https://www.cnblogs.com/jins-note/p/9513583.html安装新的版本 sudo apt-get update sudo apt-get install gcc-6 g++-6 sudo apt-get install gcc...
6应用层-6.3【实验】【计算机网络】
小心星的博客
06-27 1645
6应用层-6.3【实验】【计算机网络】
CentOS-6.3安装使用MongoDB
w36680130的博客
01-04 87
本文转载自：https://www.cnblogs.com/zhoulf/archive/2013/01/31/2887439.html 作者：zhoulf 转载请注明该声明。zhoulf 2013/01/31 原创 安装说明 系统环境：Centos-6.3安装软件：mongodb-linux-x86_64-2.2.2.tgz下载地址：http://www.mongodb.org/downl...
rhel-6.3-i386安装samba
banfu1688的博客
12-22 89
1、安装samba 1）、安装软件 rpm –ivh /mnt/Packages/samba-3.5.10-125.el6.i686.rpm 2）、创建用户 useradd myadmin 3）、设置密码 设置用户密码 passwd myadmin 设置samba密码 Smbpasswd -a myadmin 4）、创建共享文件并修改权限 创建myadmi文件夹 ...
新东方雅思词汇---6.3、brilli
weixin_30593261的博客
10-15 137
新东方雅思词汇---6.3、brilli 一、总结 一句话总结： 发光 brilliant 英[ˈbrɪlɪənt]美['brɪljənt] adj. 灿烂的，闪耀的；杰出的；有才气的；精彩的，绝妙的 1、-let？ 表小东西 booklet 英['bʊklɪt]美['bʊklət] n. 小册子 ...
ubuntu18.04源码安装gcc-6.3和vlfeat
amateur_的博客
11-13 1523
最近有个项目要在MATLAB中使用vlfeat，在编译安装的时候又踩了不少坑。在此分享一下。 1.源码安装gcc-6.3 参考： [1]https://www.w3xue.com/exp/article/20191/16725.html [2]https://blog.csdn.net/XCCCCZ/article/details/80958414 [3]https://blog.csd...
jasperreports-javaflow-6.3.0.7z_JASPERREPORT_
10-01
JasperReports是Java领域中广泛使用的开源报表库，它允许开发者创建、设计和导出各种类型的报表，如PDF、HTML、Excel、CSV等。在v6.3.0版本中，这个强大的工具进一步提升了其功能和易用性，成为了Java应用程序中生成...
testng-6.3.jar中文-英文对照文档.zip
03-14
解压 【***.jar中文文档.zip】，再解压其中的 【***-javadoc-API文档-中文(简体)版.zip】，双击 【index.html】 文件，即可用浏览器打开、进行查看。 # 特殊说明： ·本文档为人性化翻译，精心制作，请放心使用。...
jasperreports-fonts-6.3.0.7z_javareport_
10-04
JasperReports是业界广泛应用的开源报表工具，其强大之处在于能够生成多种格式的报表，如PDF、HTML、Excel等，并且提供了丰富的自定义选项。在JasperReports的众多特性中，字体库扮演着至关重要的角色，它直接影响到...
jasperreports-6.3.0.7z_javareport_
09-29
Java报表（JasperReports）是Java平台上的一款强大的开源报表工具，专注于生成静态和交互式的打印输出，如PDF、HTML、XLS、CSV、XML等多种格式。版本6.3.0在此系列中是一个重要的里程碑，提供了丰富的特性以满足企业...
vue+springboot基于java的轻院网购商城管理系统_b534a毕业设计源码.zip
10-08
本系统基于B/S结构模式，采用idea开发环境，建模工具Visio，以及关系型数据库MySQL。 系统采用前后端分离框架vue进行开发。前端开发负责页面的编写及数据的渲染。后端开发负责提供API（接口）。采用了MVC（Model-View-Controller）架构风格,前后端采用指定的API接口进行交互 其主要开发包括后台数据库的设计建立，数据库维护以及前后端应用程序(WEB)设计编码。 前端：vue.js+ElementUI 开发工具：IDEA 或者eclipse都支持 编程语言: java 框架：springboot 数据库: mysql 版本不限 数据库工具：Navicat/SQLyog都可以
音乐电影分享系统 SSM毕业设计 源码+数据库+论文（JAVA+SpringBoot+Vue.JS）.zip
最新发布
10-08
音乐电影分享系统 SSM毕业设计 源码+数据库+论文（JAVA+SpringBoot+Vue.JS） 启动教程：https://www.bilibili.com/video/BV1GK1iYyE2B
vue基于Spring Boot的宿舍管理系统qkc37 毕业设计源码.zip
10-08
本系统基于B/S结构模式，采用idea开发环境，建模工具Visio，以及关系型数据库MySQL。 系统采用前后端分离的模式进行开发。前端开发负责页面的编写及数据的渲染。后端开发负责提供API（接口）。前后端采用指定的API接口进行交互 其主要开发包括后台数据库的设计建立，数据库维护以及前后端应用程序(WEB)设计编码。 前端：vue.js+ElementUI 开发工具：IDEA 或者eclipse都支持 编程语言: java 框架：springboot 数据库: mysql 版本不限 数据库工具：Navicat/SQLyog都可以
可视化高校公寓管理系统 SSM毕业设计 源码+数据库+论文（JAVA+SpringBoot+Vue.JS）.zip
10-08
可视化高校公寓管理系统 SSM毕业设计 源码+数据库+论文（JAVA+SpringBoot+Vue.JS） 启动教程：https://www.bilibili.com/video/BV1GK1iYyE2B
MySQL Workbench用户手册：社区与商业版6.3-6.3.9
MySQL Workbench 用户手册是一份全面指南，涵盖了MySQL社区版和商业版6.3至6.3.9的详细功能和操作。此文档是专为那些尚未安装MySQL Workbench社区版用户设计的，用户可以从官方网站免费下载适用于Windows、macOS和...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值