css常用清浮动写法

/*清除浮动*/|
.clears:after{
display: block;
content: '';
clear: both;
height: ;
visibility: hidden;
overflow: hidden;
}
.fl{
float: left;
}
.fr{
float: right;
}

css实现超出内容部分溢出出现省略号,css写法

/*超出内容部分隐藏*/
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;

 css动态计算元素宽度 

/*动态计算宽度*/
width:calc( 100% - 65%);
/*除了某元素外,其他元素的样式*/
.creat-part span:not(.line-color):hover{
color: #3aa1ff;
}

  

css清浮动与动态计算元素宽度的更多相关文章

  1. 【CSS】思考和再学习——关于CSS中浮动和定位对元素宽度/外边距/其他元素所占空间的影响

      一.width:auto和width:100%的区别   1.width:100%的作用是占满它的参考元素的宽度.(一般情况下参考元素 == 父级元素,这里写成参考元素而不是父级元素,在下面我会再 ...

  2. CSS中浮动和定位对元素宽度/外边距/其他元素所占空间的影响

    ---恢复内容开始--- 一.width:auto和width:100%的区别   1.width:100%的作用是占满它的参考元素的宽度.(一般情况下参考元素 == 父级元素,这里写成参考元素而不是 ...

  3. CSS清浮动处理(Clear与BFC)

    在CSS布局中float属性经常会被用到,但使用float属性后会使其在普通流中脱离父容器,让人很苦恼 1 浮动带来布局的便利,却也带来了新问题 <!doctype html> <h ...

  4. CSS清浮动办法

    骨灰级解决办法: .clear{clear:both;height:0;overflow:hidden;} 上诉办法是在需要清除浮动的地方加个div.clear或者br.clear,我们知道这样能解决 ...

  5. CSS清浮动

    × 目录 [1]定义 [2]方法 [3]兼容 前面的话 人们经常谈起清浮动,其实就是解决浮动元素的包含块高度塌陷的问题 定义 clear 清除 值: left | right | both | non ...

  6. 解决子元素用css float浮动后父级元素高度自适应高度

    1.在最后一个子元素后面清除浮动 2.父元素加over-flow:hidden;(副作用:子元素定位不能超出父元素的范围) 3.父元素也一样浮动(最笨的方法): 4.子元素使用inline-block ...

  7. css3动态计算元素的高度及宽度

    1.px     像素,我们在网页布局中一般都是用px. 2.百分比     百分比一般宽泛的讲是相对于父元素,自适应网页布局越来越多,百分比也经常用到了 3.Viewport 当已知一个div的高度 ...

  8. CSS清浮动方法总结

    浮动----会使当前标签产生上浮效果,从而导致父标签高度塌陷的问题 1. 给父元素指定高度 <div style="height:200px"> <div sty ...

  9. CSS清除浮动使父级元素展开的三个方法

    点评:一个没有设置高度的容器div内如果存在浮动元素(即使用了属性float:left或者float:right),那么该父级元素会无法展开,下面举个例子为大家详细介绍下,希望对大家有所帮助 一个没有 ...

随机推荐

  1. Docker的可视化管理工具对比

    Docker的可视化管理工具有DockerUI.Shipyard.Rancher.Portainer等等,这里主要对这几个进行优劣对比. DockerUI: 优点   (1)支持container批量 ...

  2. Web of science数据下载以数据处理

    目标网站分析 我们要获取的就是这几个数值 程序实现 # -*- coding: utf-8 -*- """ @Datetime: 2019/2/28 @Author: Z ...

  3. crm 添加用户 编辑用户 公户和私户的展示,公户和私户的转化

    1.添加用户 和编辑可以写在一起 urls.py url(r'^customer_add/', customer.customer_change, name='customer_add'), url( ...

  4. ruby 对象转换哈希(Hash)

    通过 ActiveRecord 从数据库的某张数据表(table)中获取的对象如何转换成为 Hash orders_table 是一张订单信息表,对应的 model 为 Orders @order = ...

  5. Docker下安装GitLab

    1.需要先安装Docker和Docker Compose,参考:https://www.cnblogs.com/hackyo/p/9280042.html 2.配置GitLab SSL(可跳过): m ...

  6. nginx禁止ip登录,只允许域名访问

    公司要求,线上solr.kibana要求只能通过域名进行访问,禁止用ip+端口进行登录访问,那么,下面介绍下我是如何实现的 1.禁止ip,允许域名访问 如下图,默认安装好nginx,不让ip方式访问, ...

  7. 关于MySQL中的8个 character_set 变量

    https://blog.csdn.net/sun8112133/article/details/79921734 本篇会简单介绍在 MySQL 中关于 8个 character_set 变量的基本作 ...

  8. Ch02 课堂作业

    测试一:运行结果: 测试二:运行结果: 测试三:运行结果:

  9. JavaSE笔记-集合

    Java集合大致可分为:List,Set,Map,Queue List:有序,可重复 Set:无序(输出和插入顺序不一定一致),不可重复 Map:映射关系,根据key去访问value Queue:队列 ...

  10. 使用工具intellij idea 进行java web开发简介

    一.工具下载及安装准备 1.首先下载工具  Intellij idea ,下载地址:https://www.jetbrains.com/ 2.破解 百度下载一个 JetbrainsCrack-2.7- ...