前端
关注
分享
扫一扫
文章平均质量分 75
<阿睿>
我如苍山久远 又如水木初生
展开
-
原生input用法 总结
* 设置透明度 *//* 重置 input[type="number"] 的样式为默认样式 */3：input中的placeholder 设置为比较透明的严格或者模糊设置。/* 设置模糊效果 */ }利用 padding-left 为icon空出位置。2：input中方icon。1：默认数字空间 隐藏。原创 2023-05-24 16:41:02 · 1348 阅读 · 0 评论 -
BFC 结界 之 浅见一二
BFC - Block Formatting Context 块级格式化上下文 BFC的定义，在官方文档到中是这么介绍的：一个BFC区域包含创建该上下文元素的所有子元素，但是不包括创建了新的BFC的子元素的内部元素，BFC是一块块独立的渲染区域，可以将BFC看成是元素的一种属性，拥有了这种属性的元素就会使他的子元素与世隔绝，不会影响到外部其他元素...............原创 2022-07-03 22:49:24 · 551 阅读 · 0 评论 -
span 元素自带间距？？
半行距：content内容与内容顶部的距离padding：content内容与boder间的间距margin：border外 元素与元素之间的间距原创 2022-06-25 17:14:07 · 2808 阅读 · 0 评论 -
内联元素(span i button) 垂直水平 居中
内联元素(span i button) 垂直水平 居中原创 2022-06-25 16:20:23 · 1561 阅读 · 0 评论 -
一套完整代码解析 高度坍塌的解决方案（最全）
目录一：方案总结二：代码解析原因引入代码块 可直接使用调试（带解析）图示：进行页面布局时，为了能够达到自适应，通常高度是不会进行固定设置的，而使用float进行元素的浮动后，由于没有内容的高度，所以会发生父元素的高度塌陷问题，为了解决此类问题这里给出了几种解决方法。解决前 解决后...原创 2022-06-20 20:40:10 · 358 阅读 · 0 评论 -
（提前样式设置）列表项 的设置 和 外轮廓线的设置
目录一：列表项的提前样式设置 1.1：浏览器为所有列表提供了上下外间距与左侧内边距，记得提前设置样式重置 1.2：让那个列表项的标识符消失二：外轮廓线2.1 外轮廓线介绍三：实例分析图示：分析：引：为什么要提前进行样式设置 ？ 不同浏览器展现的效果不同列表项是具有外边距和内边距的 所以需要提前设置样式ul,ol { margin:0; padding:0;} ul { list-style:none; }1：前四局标语 本来有一定的 padding margin 在提前设置后为 0 所以跟htm原创 2022-06-17 08:30:50 · 497 阅读 · 0 评论 -
边界重叠 间距的重叠问题 （最详细）
目录一：引：两种 间距的重叠问题二：分析第一种 Css解决父子边界重合2.1 why?什么情况会出现父子边界重叠问题？补充：重叠的三种情况2.2解决办法总览2.2.1 父元素加内容 使父元素和子类间隔开来2.2.2 在父标签中加一个空的table，触发BFC（空的table会触发BFC：块级格式化上下文）2.2.3 最好的解决办法 伪类2.2.4 使父元素浮动或者子元素浮动 2.2.5 为父元素添加padding 2.2.6 为父元素添加overflow 2.2.7原创 2022-06-16 22:50:20 · 1361 阅读 · 0 评论 -
background-size 之 背景图的尺寸设置
引：background-size: 没有设置任何尺寸时使用图片本身的大小，宽度和高度都是auto默认值可以用px设置成具体的值，也可以使用百分比各种不同比例的适配问题，完美适配很少发生背景图1和背景图2 you红色边框分隔开来背景图1背景图2......原创 2022-06-16 22:03:01 · 20260 阅读 · 0 评论 -
圆角border-radius （实现圆（椭圆 胶囊 半椭圆） 和 三角形） 以及源码分析
二 实现三角形三：特殊图形（实例分析） 背后红色背景怎么设置 ？上半部分为矩形 下半部分为下半椭圆形原创 2022-06-16 10:45:11 · 2121 阅读 · 1 评论 -
关于 margin :auto的二三点事（水平居中垂直不居中）
margin是指块级元素的外边距margin 清除周围的（外边距）元素区域，margin 没有背景颜色，是完全透明的。margin 可以单独改变元素的上，下，左，右边距，也可以一次改变所有的属性margin最多有4个值，按顺序为顺时针：上，右，下，左margin后面如果只有两个参数的话，第一个表示top和bottom，第二个表示left和right因为0 auto，表示上下边界为0，左右则根据宽度自适应相同值（即居中）实例： 可以发现 auto使其自动对齐到中间 居中显示结果没有发生变化。why?分析原创 2022-06-16 09:17:04 · 2460 阅读 · 0 评论 -
overflow属性（溢出）详解
overflow属性支持4个属性，可设置当内容溢出元素框时的4种处理方式：visible 默认值。内容不会被修剪，会呈现在元素框之外。hidden 内容会被修剪，并且其余内容是不可见的。scroll 内容会被修剪，但是浏览器会显示滚动条以便查看其余的内容。auto 如果内容被修剪，则浏览器会显示滚动条以便查看其余的内容。注意:overflow 属性只工作于指定高度的块元素上。注意: 在 OS X Lion ( Mac 系统) 系统上，滚动条默认是隐藏的，使用的时候才会显示 (设置 "overflow:scr原创 2022-06-15 14:20:06 · 22619 阅读 · 0 评论 -
边框盒子 box-sizing 的 content-box 和 border-box属性
对于默认的盒子模型 : 当一个盒子的总宽度确定之后，要想给盒子添加边框或内边距，往往需要更改 width属性值，才能保证盒子总宽度不变，操作起来烦琐且容易出错，运用CSS3的box-sizing属性可以轻松解决这个问题。box-sizing属性用于定义盒子的宽度值和高度值是否包含元素的内边距和边框，其基本语法格式如下。图示：.........原创 2022-06-15 11:30:40 · 3918 阅读 · 0 评论 -
什么是内联元素(行内)
内联元素有很多种叫法，如内联元素、内嵌元素、行内元素、直进式元素等，和块级元素对应。内联元素和它的兄弟元素之间一个挨着一个，都在同一行按从左至右的顺序显示，不单独占一行。原创 2022-06-15 10:26:13 · 2505 阅读 · 1 评论 -
CSS特性 之渐变 （全网最全）
对自己学习做一个总结 做了一个专题一：渐变的基础知识1 什么是渐变 多种颜色，平缓变化的一-种显示效果影响渐变的因素2 色标: 一种颜色和这种颜色出现的位置 一个渐变,至少有两种颜色3 渐变的分类 (1)线性渐变 (2)径向渐变 (3)重复渐变<!DOCTYPE html><html> <head> <meta charset="utf-8">...原创 2022-05-27 10:29:57 · 6900 阅读 · 0 评论