分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 代码编程

CSS进阶(一)width & height

发布时间:2023-09-06 02:17责任编辑:沈小雨关键词:CSS

禁用默认行为可以使拖动行为更加流畅,如a标签

块级元素不是指拥有display:block声明的元素

块级元素具有的换行特性,它们都可以使用clear来清除浮动带来的效果

display:inline-block实际上是两个容器,外在容器负责布局,内在容器负责大小

width深入

inline-block 浮动元素 绝对定位元素都有智能的包裹性

首选最小宽度

width设置为0时,图片和文字的权重大于布局

(1)东亚文字显示为单个最小文字的宽度

(2)西方文字特定的最小宽度由英文字符单元决定。一般终止于空格,短横线(-),问号及其他非英文字符

(3)图片的最小宽度就是该元素本身的宽度

width设置了具体的宽度后就丧失了流动性

height

 width和height作用在content-box上

margin的背景永远是透明的

ie8box-sizing属性需要带前缀

对于普通文档流中的元素,百分比高度要想起作用,其父级必须有一个可以生效的高度值

css渲染的方式是先渲染父元素,后渲染子元素

元素支持height:100%的方法

(1)设置父级元素的宽度,高度为父元素的content-box的高度

html,body{ ?height:100%;}

(2)设置元素的绝对定位,高度为父元素的padding-box的高度

div{ ?position:absolute; ?height:100%;}

 max-width会覆盖width属性,超越!important的权重

min-width和max-width冲突时,min-width会覆盖max-width

min/max-width/height是为流体而生的

展开收起的动画可以由max-height/width来实现

CSS进阶(一)width & height

原文地址:https://www.cnblogs.com/goOtter/p/9697411.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved