zy_lalala的博客

图片的预加载和懒加载

css

CSS3弹性盒模型（Flex Box）弹性盒子是 CSS3 的一种新的布局模式。CSS3 弹性盒（ Flexible Box 或 flexbox），是一种当页面需要适应不同的屏幕大小以及设备类型时确保元素拥有恰当的行为的布局方式。引入弹性盒布局模型的目的是提供一种更加有效的方式来对一个容器中的子元素进行排列、对齐和分配空白空间。1. 传统布局和flex布局对比1）传统布局兼容性好布局繁琐局限性，不能再移动端很好的布局2）flex布局操作方便，布局极其简单，移动端使用比较广泛pc端

一、transition 过渡过渡（transition）是css3中具有颠覆性的特征之一，我们可以在不使用flash动画或js的情况下，当元素从一种样式变换为另一种样式时，为元素添加效果。过渡动画：是从一个状态渐渐的过渡到另一个状态，经常和 :hover 一起搭配使用语法：transition: 要过渡的属性 花费时间 运动曲线 何时开始；要过渡的属性：想要变化的css属性。高度/宽度/背景颜色/内外边距都可以，如果想要所有的属性都变化过渡，写一个all就可以花费时间：单位是

一、元素的显示与隐藏目的：让一个元素在页面中消失或者显示出来隐藏一个元素可以通过把display属性设置为"none"，或把visibility属性设置为"hidden"。但是请注意，这两种方法会产生不同的结果。1. display 显示display 设置或检索对象是否及如何显示。display: none 隐藏对象display: block 除了转换为块级元素之外，同时还有显示元素的意思。特点： 隐藏之后，不再保留位置。display:none可以隐藏某个元素，且隐藏的元素不会

一、CSS简介1. 概念CSS (Cascading Style Sheets) ，通常称为 CSS样式表 或 层叠样式表（级联样式表）。它定义了如何显示 HTML 元素。HTML 标签原本被设计为用于定义文档内容，样式表定义如何显示 HTML 元素。2. 作用主要用于设置 HTML页面中的文本内容（字体、大小、对齐方式等）、图片的外形（宽高、边框样式、边距等）以及版面的布局和外观显示样式。CSS以HTML为基础，提供了丰富的功能，如字体、颜色、背景的控制及整体排版等，而且还可以针对不同的浏