用css div做两个实体小方块 10

怎样结合css和div做一个实心黑色小方块和实心红色小方块呢?不是普通的空心矩形,是要实心带颜色的小方块怎么做啊???想放在句子前面做装饰和分段用... 怎样结合css和div做一个实心黑色小方块和实心红色小方块呢?不是普通的空心矩形,是要实心带颜色的小方块 怎么做啊???想放在句子前面做装饰和分段用 展开
 我来答
帐号已注销
高粉答主

2020-04-02 · 每个回答都超有意思的
知道答主
回答量:2169
采纳率:0%
帮助的人:35.6万
展开全部

1、首先新建一个html文件,兆搜明命名为test.html。

2、在test.html文件内,使用div标签一个模块,在div内,再使用div标签创建两个内部模块,下面将让两个内部div并排显示。

3、在test.html文件内,分别给每一个div设置class属性,分别为wdiv,fldiv,frdiv。

4、在css标签内,设置class为wdiv的div样式,定义其宽度为500px,高度为400px,背景颜色为灰色。

5、在css标签内,再分别设置class为fldiv和frdiv的样式,定义它们的宽度为240px,高度为350px,同时,使用float属性分别设置一个div浮动向左漏雹,另一个浮动向右,从而实现并排显示。

6、最族告后在浏览器打开test.html文件,查看实现的效果,就完成了。

钓侠
推荐于2017-10-08 · 知道合伙人互联网行家
钓侠
知道合伙人互联网行家
采纳数:90 获赞数:563
麦子学院讲师,WEB前端工程师,专注于WEB开发,精通Discuz、PHPCMS等开源程序!

向TA提问 私信TA
展开全部

HTML代码如下

<!doctype html>
<html>
    <head>
        <meta charset="utf-8">
      迹宏  <title>用css div做两个实体小方块</title>
        <style type="text/css">
         div{
         width: 150px;
         height: 150px;
         float: left;
         margin-right: 20px;
    姿备册     }
         .class1{
    滚兆     background-color: green;
         }
         .class2{
         background-color: darkviolet;
         }
        </style>
    </head>
    <body>
        <div class="class1"></div>
        <div class="class2"></div>
    </body>
</html>

案例截图:

已赞过 已踩过<
你对这个回答的评价是?
评论 收起
太阳当空照fb
2015-03-15 · 超过75用户采纳过TA的回答
知道小有建树答主
回答量:196
采纳率:0%
帮助的人:90.7万
展开全部

<!doctype html>
<html lang="en">
<head>旅唯晌
 <meta charset="UTF-8">
 <meta name="Generator" content="EditPlus®">
 <meta name="Author" content="">
 <meta name="Keywords" content="">
 <山明meta name="Description" content="">
 <title>Document</title>
 <style type="text/css">
 拆锋.black{width:50px;height:50px;background:black;}
 .red{width:50px;height:50px;background:red;}
 </style>
</head>
<body>
 <div class="black"></div>
 <div class="red"></div>
</body>

</html>

本回答被网友采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 更多回答(1)
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式