2024-03-12父盒子使用相对定位,子盒子使用绝对定位,利用top:50% left:50% 让子盒子相距父盒子上边界,左边界宽高的50% 利用 margin-top margin-left返回子盒子自身宽高的50%margin: auto;和 margin-top:;/* 相当于父盒子高度的50% *//*相对于父盒子宽度的50%*//*向上走回自身高度的一半*//*向左走回自身宽度的一半*//* 距离上侧150px *//* 距离左侧300px *//* x轴居中 *//* y轴居中 */_div盒子水平垂直居中

https://www.qianduange.cn//article/3672.html 分类：前端知识

2024-03-10以上是几种实现文本垂直居中和水平居中的方式，每种方式都有其适用的场景和优缺点。其中，利用margin:auto和position:absolute的方式需要知道元素的宽度和高度，适用于元素宽高固定的情况。利用table的方式比较适用于多行文本的垂直居中。可以给父元素设置display: flex，并给子元素设置align-items和justify-content属性来实现文本的水平垂直居中。利用position: absolute和top、bottom、left、right属性来实现文本的水平垂直居中。_css文字水平居中

https://www.qianduange.cn//article/3522.html 分类：前端知识

2024-03-08css权威指南》指出，如果没有显示声明包含块的height，百分数高度会重置为auto，所以上面div1height设置为任何值都跟设置没设置一样。想要令body里一个块元素（div）占全屏，相信很多人（包括我）都会直接把body设置宽高100%，但实际却是，行不通。因为body跟div一样是块元素，直接赋值给块元素height:100%，相当于就是默认值的独占一行。所以这里写body{ width:100%;}，其实是毫无作用的。优点：①简洁，②缩小浏览器，拉动滚动条也还是满屏背景。_div铺满全屏的三种方式

https://www.qianduange.cn//article/3432.html 分类：前端知识

2024-03-07在uniapp下使用了swiper来实现滑动,默认属性下,一个item占满整个屏幕我这想要的效果是所有的item,横向排列,最终实现的效果如下所示实现这种效果很简单就是使用了css中的inset属性inset属性说明如下： inset CSS属性，它具有与简写边距相同的多值语法。虽然是CSS逻辑属性规范的一部分，但它定义物理偏移量，而不考虑元素的书写模式、方向和文本方向。属性值可以为长度，百分比，关键字（auto），全局的值（inherit; initial; revert; revert-laye_css inset

https://www.qianduange.cn//article/3398.html 分类：前端知识

2024-03-051.有一个父盒子，它里面还有一个子盒子，子盒子能够存在的地方是父盒子的content区里，如果父盒子通过margin-left进行移动，子盒子也会同时进行移动。在没有设置块盒宽度的时候，块盒content区的width的默认值是auto，它会自动计算，用父盒子的content宽度值减去块盒的两边的border=块盒的content值。margin:auto， 表示0，这句话意思是，盒子上下的margin值为0，左右的margin（水平上）还是有值的。意思是：子盒子所有的百分之的值=百分比乘以父盒子的宽度。_每个块盒子的宽度等于等于包含块

https://www.qianduange.cn//article/3248.html 分类：前端知识

2024-03-04其中，::-webkit-scrollbar用于设置滚动条整体样式，::-webkit-scrollbar-thumb用于设置滚动条滑块样式。以上代码将滚动条宽度设置为 6px，高度设置为 6px，滑块圆角设置为 3px，滑块颜色设置为灰色半透明，滑块轨道颜色设置为浅灰色半透明。将overflow属性设置为auto或scroll，当内容超出div的高度或宽度时，就会出现滚动条。2.给div设置CSS属性overflow为auto或scroll，这将使div在高度范围内滚动。是你要选择的元素的类名。_div 滚动

https://www.qianduange.cn//article/3193.html 分类：前端知识

2024-03-041. 父元素设置display:flex, 子元素设置 margin:auto. 2. 父元素相对定位，子元素绝对定位 4个属性都设置0，再设置margin:auto. 3. 父元素相对定位，子元素绝对定位，`left:50%,top:50%,transform:translate(-50%,-50%)` 4. flex布局，父元素 `display:flex,justify-content:center,align-items:center`

https://www.qianduange.cn//article/3182.html 分类：前端知识

2024-03-03一、语法二、表格的相关属性三、高级表格应用1.单元格间距2.合并相邻单元格边框3.无内容时单元格的设置4.显示单元格行和列的算法4.1 值为auto时(默认值)4.2 值为fixed时5.表格列标题6.表格标题设置表格标题的位置7.数据行分组8.数据列分组..._css 表格

https://www.qianduange.cn//article/3131.html 分类：前端知识

2024-02-29web前端之不一样的居中方式、解决tabBar选项卡居中问题、css支持嵌套、auto_js 对象属性过多

https://www.qianduange.cn//article/2918.html 分类：前端知识

2024-02-26父级控制子集居中 伪元素和 inline-block / vertical-align（兼容 IE8）transform(不兼容 ie8 以下)设置 margin:auto（该方法得严格意义上的非固定宽高，而是 50%的父级的宽高。）2、单行文本的溢出显示省略号（一定要有宽度）3、多行文本溢出显示省略号 兼容式：4、IOS手机容器滚动条滑动不流畅5、修改滚动条样式6、calc7、scss定义变量8、flex 不生效问

https://www.qianduange.cn//article/2711.html 分类：前端知识