摘要: canvas与svg都是可以在浏览器上创建图形,因此,在html5中感觉canvas和svg很相似,但是实际上canvas与svg有着根本的区别。下面php中文网通过比较canvas和svg之间的不同来给大家总结了关于canvas与svg的区别。一起来看一看吧。 在说canvas与svg的区别之前, 阅读全文
posted @ 2020-07-05 22:10 青老师 阅读(1562) 评论(3) 推荐(0) 编辑
摘要: 目录 水平居中 行内元素 块级元素 方案一:(分宽度定不定两种情况) 方案二:使用定位属性 方案三:使用flexbox布局实现(宽度定不定都可以) 垂直居中 单行的行内元素 多行的行内元素 块级元素 水平垂直居中 已知高度和宽度的元素 未知高度和宽度的元素 方案一:使用定位属性 方案二:使用flex 阅读全文
posted @ 2020-07-05 22:03 青老师 阅读(387) 评论(0) 推荐(0) 编辑
摘要: BFC的定义: BFC(Block formatting context)直译为"块级格式化上下文"。它是一个独立的渲染区域,只有Block-level box参与, 它规定了内部的Block-level Box如何布局,并且与这个区域外部毫不相干。 如何形成: 根元素 float属性不为none 阅读全文
posted @ 2020-07-05 20:45 青老师 阅读(1252) 评论(0) 推荐(0) 编辑
摘要: 控制非文档流元素的叠放顺序,该属性值越高,元素位置越靠上。 当元素设置为relative、absolute或fixed时,通过设置z-index:number; 决定叠放顺序,属性值越高,元素位置越靠上。 阅读全文
posted @ 2020-07-05 20:41 青老师 阅读(747) 评论(0) 推荐(0) 编辑
摘要: CSS 有三种基本的定位方式:文档流、浮动和定位。 文档流(normal flow): 文档流是所有元素布局的基础,作为从左到右、从上到下的布局方式,这是最常用的一种排版布局方式。 浮动(float):float:left/right;浮动的框可以向左或向右移动,直到它的外边缘碰到包含框或另一个浮动 阅读全文
posted @ 2020-07-05 20:40 青老师 阅读(1465) 评论(0) 推荐(1) 编辑
摘要: 1. 浮动元素有什么特征?对父容器、其他浮动元素、普通元素、文字分别有什么影响? 特征 任何定义为float的元素都会自动被设置为一个块状元素显示,相当于被定义display:block;声明。这样就可以为浮动元素定义width和height属性,即使是内联显示元素也可以。 当我们没有指定浮动元素宽 阅读全文
posted @ 2020-07-05 20:37 青老师 阅读(804) 评论(0) 推荐(0) 编辑
摘要: 最常用的两种方式: display:none,这种方式可以使元素彻底从文档中删除,会造成浏览器的回流与重绘 visibility:hidden,元素会从页面中消失,它原本占据的空间会被保留,会造成浏览器的重绘,适用于希望元素隐藏又不影响页面布局的场景,但是该属性会被子元素继承,所以若不希望子元素隐藏 阅读全文
posted @ 2020-07-05 20:25 青老师 阅读(376) 评论(0) 推荐(0) 编辑
摘要: white-space: nowrap; /* 文本不换行 */ overflow: hidden; /* 溢出文本隐藏 */ text-overflow: ellipsis; /* 溢出文本省略 阅读全文
posted @ 2020-07-05 20:21 青老师 阅读(161) 评论(0) 推荐(0) 编辑
摘要: 既呈现 inline 特性(不占据一整行,宽度由内容宽度决定) 又呈现 block 特性 (可设置宽高,内外边距) 默认情况下,inline-block元素之间就有空隙出现(缝隙的实质就是元素标签段之间的空格) 1.去掉HTML中的空格; 2.使用font-size:0; vertical-alig 阅读全文
posted @ 2020-07-05 20:20 青老师 阅读(250) 评论(0) 推荐(0) 编辑
摘要: 第一种是设他们父级的字体大小为0 第二种是两个button的html代码不要换行 阅读全文
posted @ 2020-07-05 15:50 青老师 阅读(526) 评论(0) 推荐(0) 编辑
摘要: line-height: 2 表示单行文本的行高为它本身的两倍 line-height: 200% 表示单行文本的行高为系统默认字体的200% 在继承性上: 对父元素设置了line-height: 2后,父元素的子元素会继承line-height: 2这个属性,子元素的行高都是自身高度的2倍,是相对 阅读全文
posted @ 2020-07-05 15:47 青老师 阅读(685) 评论(0) 推荐(1) 编辑
摘要: 外边距合并指的是,当两个垂直外边距相遇时,它们将形成一个外边距。 合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者。 注释:只有普通文档流中块框的垂直外边距才会发生外边距合并。行内框、浮动框或绝对定位之间的外边距不会合并。 几种解决办法: 1:父容器:border:1px solid;( 阅读全文
posted @ 2020-07-05 15:44 青老师 阅读(518) 评论(0) 推荐(0) 编辑
摘要: 行内元素有哪些? a - 锚点 em - 强调 img - 图片 font - 字体设定 ( 不推荐 ) i - 斜体 input - 输入框 块级元素有哪些? address - 地址 blockquote - 块引用 center - 举中对齐块 dir - 目录列表 div - 常用块级容易, 阅读全文
posted @ 2020-07-05 15:27 青老师 阅读(1147) 评论(0) 推荐(1) 编辑
摘要: W3C标准盒模型中padding、border所占的空间不在width、height范围内 { box-sizing: content-box; } IE盒模型中width、height包括content尺寸+padding+border { box-sizing: border-box; } 阅读全文
posted @ 2020-07-05 15:24 青老师 阅读(261) 评论(0) 推荐(1) 编辑
摘要: 1、px px就是pixel的缩写,意为像素。px就是一张图片最小的一个点,一张位图就是千千万万的这样的点构成的,比如常常听到的电脑像素是1024x768的,表示的是水平方向是1024个像素点,垂直方向是768个像素点。 2、em 参考物是父元素的font-size,具有继承的特点。如果自身定义了f 阅读全文
posted @ 2020-07-05 15:20 青老师 阅读(2045) 评论(0) 推荐(1) 编辑
摘要: CSS继承可定义为特定的css属性向下传递到子孙元素,就是指被包在内部的标签将拥有外部标签的样式,即子元素可以继承父元素的属性。 一、能继承的属性 1. 字体系列属性:font、font-family、font-weight、font-size、font-style; 2. 文本系列属性: (1)内 阅读全文
posted @ 2020-07-05 15:12 青老师 阅读(1298) 评论(0) 推荐(1) 编辑
摘要: 伪类本质上是为了弥补常规CSS选择器的不足,以便获取到更多信息; 伪元素本质上是创建了一个有内容的虚拟容器; CSS3中伪类和伪元素的语法不同;伪类 :link :hover ,伪元素 ::before ::after 可以同时使用多个伪类,而只能同时使用一个伪元素; 其中伪类和伪元素的根本区别在于 阅读全文
posted @ 2020-07-05 15:06 青老师 阅读(1017) 评论(0) 推荐(1) 编辑