一、前言 css3动画效果的强大不言而喻，自它出现一直热度不减，它与js动画的优劣也一直成为前端界争论的话题，不可置疑的是css3动画的出现在一定程度上降低了动画效果的实现难度，利于前端的学习，其精简的代码量把我们从烦人的js调试中解放出来，当然css的动画效果有其局限性…

flex伸缩布局 一、是什么 Flexible Box 简称 flex，意为”弹性布局”，可以简便、完整、响应式地实现各种页面布局，采用Flex布局的元素，称为flex容器container。它的所有子元素自动成为容器成员，称为flex项目item。 容…

文章目录 一、响应式网页简介二、Web开发工具三、响应式开发1、宽度断点2、media媒体查询 一、响应式网页简介 响应式网页设计，是一种常用的网页设计布局。其核心思想为：网页内容可以随着用户使用的设备分辨率的不同而改变。从而达到能够适应不同设备效…

Bootstrap是目前比较受欢迎的前端框架。它是基于 HTML、CSS、JAVASCRIPT 的，简洁灵活。因为在前几个月的学习中有了解到Bootstrap，并且当时就使用Bootstrap制作了简单的响应式布局。最近又接触到，所以还是打算写下这篇文章，算是记…

主流浏览器有5种：IE、chrome、firefox、safari、opera. 浏览器兼容 „ 浏览器私有前缀 -moz- 火狐浏览器-webkit- 360、苹果、猎豹、搜狗、QQ、 Chrome等浏览器-o- Opera/欧朋浏览器-ms- IE、百度等浏览器 „ 跨…

前面介绍了自适应布局，但是将窗口尺寸变化较大时，仅仅依靠自适应布局可能出现图片异常放大或页面内容稀疏、留白过多等问题。此时就需要借助响应式布局能力调整页面结构。 响应式布局 响应式布局是指页面内的元素可以根据特定的特征（如窗口…

目录 什么是 Viewport? 设置 Viewport CSS 网格视图 什么是网格视图? 响应式网格视图 CSS 媒体查询 添加断点 当屏幕 (浏览器窗口) 小于 768px, 每一列的宽度是 100%: 为移动端优先设计 其他断点 HTML 实例 方向：横屏/竖屏 如果是横屏背景将是浅蓝色： CSS 图片…

响应式布局和自适应 写网页时，经常要求要适配不同屏幕，要求可以在大屏幕，ipad，手机上可以显示正常。对于公司的官网这是很重要的。那么，这就涉及到了响应式布局和自适应。 文章目录 响应式布局和自适应前言一、响应式…