软件入门
会员教程
人工智能AIGC
职业路径
训练营
更多

课程专辑

以点破面 专精学习

文章 / 软件下载

行业动态 下载软件

作品/IP合作

赏析作品 IP赋能商业

超职套课

海量好课 单套购买

优质讲师

变得和他们一样优秀

虎课APP

APP下载

AI智能抠图

2步搞定抠图

企业VIP

了解更多>企业VIP尊享特权

主账号管理

多人团队协作必备

学习内容管理NEW

及时了解学习进度

报销无忧

正规发票 极速开票

专属客服服务

反馈优先响应

开通企业VIP最高赠送60天

助力企业打造全方位的新职业人才

HOT 个人VIP

可搜索课程、软件、讲师、读书、直播

热门搜索

C4D AIGC人工智能 新年 视频剪辑 植树节 Midjourney stable diffusion ComfyUI 海报

您还没有专辑

开始创建自己的专辑吧

创建
您可在个人中心-我的专辑处查看
当前位置：首页 > 电商教程 > 店铺装修-float浮动在布局中的意义
下一节课程：这里显示课程名称长度多少课程名播放下一节重新播放
5s后将自动前往下一节课
为你推荐课程
为你推荐直播课
升级VIP特权，畅学全站89000+会员教程
立即升级特权超值
89000+教程
不限次学素材/源文件
不限次下载161大职业路径
不限次学虎课读书
不限次收听

免费学习即将结束

关闭继续学习>

精选笔记(15)
精选笔记(15)不显示精选笔记
分享/下载
加入专辑收藏源文件本课素材
记笔记
编辑完成后，记得点我~

王晓楠
讲师：王晓楠

关注人数：10105

AI助教课程信息目录
我是AI助教小虎，你可以对本课程提出问题，我将根据课程内容为您解答
🌟1. 帮我总结这节课程的主要内容与知识点总结
💡2. 帮我提炼这节课程的章节段落
一键登录使用AI助教全新功能
复制

内容由AI大模型生成，请仔细甄别内容

为你推荐换一批
图文教程学员互动 (25) 视频字幕
综合评分：9.9 评分100%作业点评课后上传的作业，学习过程中有困难疑惑都可进行提问
您需要学习后才可以评价， 立即学习
全部互动一课一练(3)课程提问
推荐
推荐评论时间回复数
有内容评论
本课作业要求(已有3份作业)
作业要求：根据视频教程中的内容，进行作业练习，在互动评论中上传你的作业，也可运用其他素材进行练习

本篇教程学习的是店铺装修-float浮动在布局中的意义，喜欢的一起来学习吧。

那我们开始今天的教程吧。

1.浮动就相当于在正常排版的情况下，让它一左一右去排版，创建的所有div标签都是按照顺序往下排列的，但是添加了这个浮动之后，可以让其中一个元素，跑到另一个位置上来。

2.它的属性叫float，它有两个值，一个是left，一个是right，添加一个父级，里面有两个子级元素，给第一个div加个样式，宽度500px，高度500px，添加背景颜色，然后再添加两个子元素。

3.给第一个添加样式，宽度100px，高度100px，添加一个背景颜色，打上文字，第二个加个style，宽度150px，高度150px，添加背景颜色，打上文字，正常盒子是按照顺序往下排列，然后来做浮动布局。

4.给这个元素添加【float】，【left】，下面写个【float】，【right】，这个盒子第一个靠左，第二个靠右了，如果两个都是左浮动，那么它就会按顺序排列。

5.做一个导航条，创建个盒子，创建一些子级，可以使用ul来做布局，定义li，放一个href，打上文字，复制6个，是顺序往下排列的，要想显示一行，给li加一个style，这就是它的子级，给ul加个边框，1px，实线红色，宽度等于屏幕的宽度，高度400px。

6.给li添加style样式，宽度100px，高度30px，添加背景颜色，把每个都添加上一样的样式，加个float，加个left，这时候第一个加了浮动，但是第二和第三个叠在一起了。

查看更多
您需要学习后才可以评价， 立即学习
字幕加载中...
登录后查看更多
换一批

为你推荐

虎课网为您推荐店铺装修-float浮动在布局中的意义视频教程、图文教程、素材源文件下载，学员课后练习、作品以及评价等内容。店铺装修-float浮动在布局中的意义教程讲师：王晓楠，使用软件：DW（CC2016），难度等级：初级练习，视频时长：26分27秒 查看全部
相关教程:
店铺装修教程dw店铺装修教程淘宝店铺装修教程店铺海报教程店铺logo教程店铺设计教程dw全屏店铺教程cssflex布局教程cad布局教程word布局教程布局画法教程
相关文章:
店铺装修-float浮动在布局中的意义图文教程
最新文章:
cad2017激活教程cad对象捕捉设置在哪里找呢2014cad注册机下载你知道cad图形文件无效怎么办吗cad怎么缩放到指定大小cad自动保存文件怎么打开呢cad平方米符号怎么打m2你知道cad转pdf怎么变成黑白吗cad转版本怎么完成？ai转cad怎么做？
软件入门:
Spline教程Lightroom2021教程AI2017-2020教程Lightroom教程Affinity Designer教程ID2017-2020教程C4DR26教程Capture One教程PS CC2017教程SpeedGrade教程PS2018-2020教程Dimension2019教程Affinity Publisher教程Affinity Photo教程

同学，小虎知道你非常努力的想学习！

老师录制课程真的也很辛苦

赞助一下吧

确定学习吗？

您每天可免费学习一个教程。

成为VIP可无限学习 !

成为VIP吧!

再看看确认学习

成为VIP吧!

您已经免费学习 1 个教程 !

我们录制教程很努力的，赞助下吧 !

升级VIP吧!

您已经学习 5 个教程啦!

我们录制教程很努力的，赞助升级下吧 !

您已经累计下载5个源文件


您在当前分类下不是VIP，赞助VIP享受无限下载


赞助VIP

您已经累计下载5个素材文件


您在当前分类下不是VIP，赞助VIP享受无限下载


赞助VIP

您已经累计下载5个源文件


您在当前分类下不是VIP，赞助VIP享受无限下载


赞助VIP

您已经累计观看5个图文教程


您在当前分类下不是VIP，赞助VIP享受无限观看


赞助VIP

学习后才能评价哦!

我知道了

学习后才能提问哦!

我知道了
我要评论
本次课程评分：
课程难易程度：太简单简单适中有点难太难了
您近期已提交过同样评论
请勿频繁提交重复评论~
0/200
提交
我要评论

确认要删除这条评论吗？删除后将无法恢复。

取消确认

获得30虎课币

评论提交成功，将在审核通过后显示

我知道了
评论错误

当日最多删除五条评论

×

下载素材/源文件：

下载课程源文件下载课程素材
收藏成功
取消成功
直播答疑中
学习过程有困惑？
阿角老师在线直播答疑！
参与直播答疑
已是第一张图了
已是最后一张图了
已是第一张图了
已是最后一张图了
记笔记

导出笔记

笔记导出历史

00:00

0/12
确定保存
笔记导出历史导出完成的笔记将保留1天，如有需求请及时下载
课程名称
导出时间
文件大小
状态
操作
AI视频总结
AI正在分析视频，请稍等…
AI总结遇到了一些问题 点击重新获取
点击重新获取
成为全站通VIP 查看完整AI总结
复制
特惠
充值7折购
今日还在继续学习的你，太棒了！
7折
折扣券可用于
年费无限VIP
立 即
使 用
此活动优惠不可与其他活动叠加使用
有效期：00 时 00 分 00 秒
消息
登录即可查看消息记录
建议
意见
官方
客服
在线咨询客服热线

您可以与在线客服进行沟通获得帮助

工作日：9:00~22:00节假日：9:00~18:00

联系在线客服

您可以电话联系客服进行沟通获得帮助

工作日：9:30~18:30

400-862-9191
虎课
积分
免费学习89000+个教程！
配套素材、源文件一键下载！
昨日学员已学习了44,206次
并提交了243份作业！
登录后立即学习！
同意《注册协议》& 《隐私协议》
登录后立即学习！
loading
微信扫码关注即可登录
< 返回
同意《注册协议》& 《隐私协议》
您需要同意协议才可以进行登录
登录虎课网，每天免费学课程全站 89000+ 视频会员教程 | 每日可免费学 1 课
为确保账户信息安全
请先进行真实姓名验证后进行充值付款
立即验证