css
关注
分享
扫一扫
前端最菜
计科专业，21届，准备从事前端开发。努力进步中！愿意相互学习欢迎交流探讨！欢迎互粉！个人网页：www.ljkeep.cn
展开
-
display、visibility、opacity区别
display: none; DOM 结构：浏览器不会渲染 display 属性为 none 的元素，不占据空间； 事件监听：无法进行 DOM 事件监听； 性能：动态改变此属性时会引起重排，性能较差； 继承：不会被子元素继承，毕竟子类也不会被渲染； transition：transition 不支持 display。 visibility: hidden; DOM 结构：元素被隐藏，但是会被渲染不会消失，占据空间； 事件监听：无法进行 DOM 事件监听； 性 能：动态改变此属性时会引起重绘，性能较高；原创 2020-07-11 20:02:55 · 432 阅读 · 0 评论 -
记录一次在css 中使用calc遇到的坑
css3 calc()方法 大坑 运算符前后要加空格("*" 和 “/” 时，其前后可以没有空格，但建议保留) 在使用scroll 时 想要把顶部的内容保留一部分，在这里用计算，但是怎么都没有效果，结果自己蠢哭了，一定要记录一下，花了好久好久才看出来~wuwuwu。 “-”号前面和后面一定要加空格，加空格 加空格 加了空格就有效果了 顺便总结一下calc() 可以使用百分比、px、em、rem等单位运算，可以混合使用各种单位进行运算。 ...原创 2020-07-05 23:51:04 · 618 阅读 · 3 评论 -
圣杯布局和双飞翼布局
圣杯布局 <!DOCTYPE html> <html> <head> <title>圣杯</title> <style type="text/css"> *{ margin: 0; padding: 0; } header{ width: 100%; height: 100px; background-color: #f4f4f4; } footer{ width: 100%;原创 2020-06-29 21:24:59 · 154 阅读 · 0 评论 -
flex布局总结
一、Flex 布局是什么？ Flex 是 Flexible Box 的缩写，意为"弹性布局"，用来为盒状模型提供最大的灵活性。 设为 Flex 布局以后，子元素的float、clear和vertical-align属性将失效。 display : flex display: inline-flex;//行内元素方式 归纳 采用 Flex 布局的元素，称为 Flex 容器（flex container），简称"容器"。它的所有子元素自动成为容器成员，称为 Flex 项目（flex item），简称"项原创 2020-06-29 17:30:51 · 219 阅读 · 0 评论 -
normalize.css源码及解释
Normalize.css Normalize.css 使浏览器呈现所有 HTML 元素更加一致，并且符合现代 web 标准。Normalize.css 只作用于需要规范化的样式。 作用 保留有用的默认值，不同于许多 CSS 的重置 纠正错误和常见的浏览器的不一致性 标准化的样式，适用范围广的元素 浏览器支持 Google Chrome (latest) Mozilla Firefox (latest) Mozilla Firefox ESR Opera (latest) Apple Safari 6+原创 2020-06-21 16:37:11 · 716 阅读 · 0 评论