文档章节

浮动属性的漏洞

书呆子拍皮球
 书呆子拍皮球
发布于 2016/06/20 10:43
字数 153
阅读 4
收藏 0

当设置如下HTML和css样式时第二个li会相对与上一个继续浮动如下:

这时就需要对li设置一下清除浮动clear属性,对li上下的标签进行一下浮动清除。

理想效果:


HTML代码
<li class="yy_list">
    <div class="box active">
        <div class="choose"></div>
            医院
    </div>
</li>
<li class="yy_list">
    <div class="box">
        <div class="choose"></div>
            类别
    </div>
</li>

css样式

.yy_list{
  height: 96px;
  width: 100%;
 clear: both;
  background-color: #ffffff;
  //border-bottom: 1px solid @border_color;
  .box{
    border-bottom: 1px solid @border_color;
    margin: 0 32px;
    .font(96px, @font24, left, #000, 1);
    .choose {
      width: 20px;
      height: 16px;
      float: left;
      margin: 40px 32px 41px 24px;
    }
    &.active {
      .choose {
        .sprite;
        .ico_16;
      }
      color: @header_color;
    }
  }
}

© 著作权归作者所有

共有 人打赏支持
书呆子拍皮球
粉丝 2
博文 42
码字总数 5423
作品 0
唐山
私信 提问
令人惊叹的 CSS 漏洞攻击,Firefox 和 Chrome 中枪

来自 Google 的安全工程师 Ruslan Habalov 近日在其个人站点中披露,在 Chrome 和 Firefox 等浏览器中出现了一个旁路攻击,能够泄露跨来源框架的视觉内容。发现该漏洞的还有德国的渗透测试工...

王练
2018/06/02
4.4K
13
CSS Float(浮动)

什么是CSS Float(浮动)? CSS的Float(浮动),元素可以围绕其他元素向左或向右被推动 Float(浮动),往往是用于图像,但它在布局时一样非常有用。 元素怎样浮动 元素的水平方向浮动意味着元素只...

wybo521
2016/01/17
21
0
网页布局基础(2)-横向俩列布局

一、float属性 3个属性:left(左浮动) / right(右浮动) / none(不浮动) 特点:元素会左 / 右移,直至触碰容器为止。  就像容器边缘有磁铁吸引 *注意:设置了浮动的元素,依旧处于标准...

iBazinga
2016/12/04
4
0
css中float和position属性

盒子的三种定位形式 在标准流下的定位 在浮动属性下的定位 在定位属性下的定位 除非设置浮动属性或定位属性,否则所有盒子都是在标准流中定位 顾名思义,标准流中元素盒子的位置由元素在HTM...

RanoB
2016/12/26
14
0
【前端Talkking】 CSS系列——CSS深入理解之float浮动

float属性是CSS中常用的一个属性,在实际工作中使用的非常多,如果使用不当就会出现意料之外的效果。虽然很多人说浮动会用就行、浮动过时了,但是对于优秀的前端开发人员,需要有"刨根问底"...

micstone
2018/05/15
0
0

没有更多内容

加载失败,请刷新页面

加载更多

https

进入阿里云域名后台,修改DNS为阿里云官方DNS(默认为官方),然后点击“免费开启SSL证书” 点击“申请”、“验证”并等待签发 然后根据自己的服务器类型下载对应的证书 我使用的是lnmpa工具...

临江仙卜算子
22分钟前
0
0
Quartz监听器Listerner

概述 Quartz的监听器用于当任务调度中你所关注事件发生时,能够及时获取这一事件的通知。Quartz监听器主要有JobListener、TriggerListener、SchedulerListener三种,顾名思义,分别表示任务、...

大笨象会跳舞吧
50分钟前
4
0
Call exception, tries=10, retries=35, started=38348 ms ago, cancelled=false, msg=pc-node1 row

写hbase的问题,2019-01-18 23:23:28,082 | INFO | [hconnection-0x6431d54d-shared--pool2-t5] | Call exception, tries=10, retries=35, started=38348 ms ago, cancelled=false, msg=p......

stys35
53分钟前
2
0
docker 安装portainer、gogs、redis、mongodb、es、rabbitmq、mysql、jenkins、harbor

1、准备三台虚拟机ip如下 编号 Ip 1 192.168.100.101 2 192.168.100.102 3 192.168.100.103 2、镜像应用编排 192.168.100.101 主要安装系统运维相关服务 192.168.100.102 主要安装mysql、mon...

北岩
今天
8
0
storm 提交任务报SocketException错误及解决办法

提交任务爆错: org.apache.storm.thrift.transport.TTransportException: java.net.SocketException: Broken pipe (Write failed) ..... Caused by: org.apache.storm.thrift.transport.TTr......

jingshishengxu
今天
1
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部