- 博客(12)
- 问答 (1)
- 收藏
- 关注
原创 清除浮动(高度塌陷)的方法及原理!
为什么要清除浮动?(清除浮动主要是为了解决,父元素因为子级元素浮动引起的内部高度为0的问题)1.如下,我给父盒子设置一个boder,内部放两个盒子一个big 一个small,未给big和small设置浮动,则他们会默认撑开父盒子2.当我给内部两个盒子加上float属性的时候顶部深蓝色盒子就会顶上来,然后父盒子因为没设置高度,变成一条线,big和small已经浮动了总结一下:当父元素不给高度的时候,内部元素不浮动时会撑开而浮动的时候,父元素变成一条线这时候很多人会想到新建
2020-10-25 16:09:58 938 2
原创 找样机 - 免费共享样机资源
欢迎来到“找样机”!这是一个专注于免费共享样机资源的开创性网站,为广大用户提供丰富的样机素材,无论您是专业设计师、创业者还是对样机感兴趣的普通用户,我们都为您准备了丰富多样的资源。
2024-01-31 16:04:22 365
原创 鼠标移入下拉菜单相关问题?
一、这是需要实现的效果功能描述:鼠标移入导航,下方显示对应的菜单;鼠标移出导航,隐藏下方对应的菜单;当下方菜单显示后,鼠标移入没有变化;当鼠标移出下方的菜单,菜单进行隐藏;如图所示:二、下面是我实现的代码(有bug):bug1 向各位侠客献上:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="view
2020-12-06 00:29:29 784
原创 CSS中19种隐藏元素的方法
1.width:0;/height:0;这种方式的缺点是隐藏不了文字,如果需要隐藏文字,那么:2.针对文字font-size:0;3.针对文字color:transparent;4.opacity:0;原理是把元素设置为透明。opacity属性的意思是设置一个元素的透明度。它不是为改变元素的边界框(bounding box)而设计的。这一位着将opacity设置为0只能从视觉上隐藏元素。而元素本身依然占据它自己的位置并对网页的布局起作用,它也将响应用户交互。5.通过定位,把元素移出屏幕外即可。
2020-10-25 16:31:23 374
原创 CSS如何画三角形
如何用CSS画三角形1.前言在博主某次前端面试过程中,被问到如何用css画一个三角形?相信很多朋友在面试中也被问到过这个问题,并且网上针对这个问题也有非常多的解决方案,大部分都是采用border来实现,经过我一番搜索,发现讲具体实现的代码的很多,但是讲实现原理的几乎没有(也可能是我没有找到),下面,我就谈谈利用border画三角形其内部的原理。2.原理2.1 第一步首先,先来一个div,然后给这个div加一层border,并且给上下左右border分别加上不同颜色,以便观察,代码和效果如下:.
2020-10-25 16:27:23 1199 2
原创 marign塌陷解决方案
一、什么是margin塌陷在标准文档流中,竖直方向的margin会出现叠加现象(水平方向不会塌陷),两个margin紧挨着,中间没有border或者paddingmargin直接接触,就产生了合并表现为较大的margin会覆盖掉较小的margin,竖直方向的两个盒子中间只有一个较大的margin,这就是margin塌陷现象先举个例子<!DOCTYPE html><html> <head> <meta charset="utf-8"> &
2020-10-25 16:14:46 600
原创 HTML元素居中的10大方式及原理
一、text-align:center;这个是没有浮动的情况下,我们可以先将要居中的块级元素设为inline/inline-block,然后在其父元素上加上属性text-align:center;即可。如果要居中的块级元素直接是内联元素(span、img、a等),直接在其父级元素上加上属性text-align:center;即可;二、margin:0 auto;前提:居中的元素必须是块级元素,如果是内联元素,需要添加属性display:block;而且元素不浮动。三、绝对定位+偏移(已知宽高,需计.
2020-10-25 16:02:35 3912
原创 flex(弹性盒子):1的变化,以及flex对width的影响!
生命不息,学习不止在今天这个日子,祝愿所有程序员们的世界,永远没有bug接下来,打开电脑!关于疑问:弹性盒子flex:1的变化?弹性盒子对子元素width的影响?调试代码:(纯CSS实现手风琴效果)<div class="box"> <ul> <li> <span>谨防三大减肥</span> </li> <l
2020-10-24 23:59:42 6351 4
原创 内联(行内)元素间距解决方法
内联(行内)元素display: inline;宽高大小由子元素决定,不能手动修改宽高,子元素一般放置文本元素,与其他内联元素并排在同一行内联元素不能改变宽高,导致有些属性无效,比如:width系列、height系列、margin-top、margin-bottom、padding-top、padding-bottom、line-height。常用的内联标签:<span>、<img>、<em>、<strong>、<i>使用内联元素你可
2020-10-14 19:37:44 1113
原创 dl,dt,dd为什么没有缩进?
文章目录问题描述:dl回顾:源代码:原因分析:浏览器参数查询:IEFirefoxChromeSafariOperaChromeSafariOpera问题描述:今天我在写项目的时候,使用了dl,dt,dd,发现dd的缩进不见了。(提示:dd标签默认有缩进)dl回顾:dl就是定义一个列表dt就是这个列表的标题dd就是dt标题的描述内容,默认缩进<dl> <dt>战狼2</dt> <dd>主要演员:吴京、弗兰克·格里
2020-10-11 02:08:27 995 3
原创 js开发数独,判断行和列是否重复,遇到问题不解。求大神帮助。
/*判断当前在什么位置*/function xy(text){ //获取当前点击的id var a=document.getElementById(this.selector); switch(a.id){ case "a0": suzi[0][0]=text; rowS(0,0); colS(0,0); break; case "a1": s...
2020-01-11 15:12:44 264
空空如也
js开发数独,判断行和列是否重复,遇到问题不解。求大神帮助。
2020-01-11
TA创建的收藏夹 TA关注的收藏夹
TA关注的人