1. 头部 header 固定 的两种方式

  • 固定定位
  • 内容区 包裹,使用 overflow: hidden;

2. 动画第二次起效

缺少动画初始参数

3. 隐藏元素

display: none;
visibility: hidden;
opacity: 0;
width: 0;
height: 0;
transform: scale(0);
transform: translate(-10000px);

4. 滚轮事件 绑定给 document 

5. window.onresize 处理浏览器缩放问题

6. 注意 background 覆盖问题,记得分开写

7. 如果一个元素进行 3D 变换,最好对其父元素 开启 3D 空间。(解决层级问题)

8. backface-visibility: hidden;        背面不可见

 

9. transition: 1s top, 1s left, 1s right, 1s bottom;

10. 能用 visibility 实现隐藏,就不用 display: none;

 

11. 一定要注意 变量 += +变量+1; 防止变量是字符串。

12.canvas 动画

(1) 不能用 css  设置 canvas 的 width 和 height

(2) 啊

13. overflow: hidden;    开启了 BFC ,会打乱 3D 布局。

PC_官网设计的更多相关文章

  1. 开源项目 PM 浅谈如何设计官网

      有用户反馈进入官网首页光秃秃的一片,大家忙着做产品,忽略了官网的建设,惭愧惭愧.   确实,极简风格和极其简单还是有很大区别的.     旧的 Web 端   除了极其简单之外,它还有一个小问题, ...

  2. 对石家庄铁道大学官网UI设计的分析

    在这一周周一,老师给我们讲了PM,通过对PM的学习,我知道了PM 对项目所有功能的把握, 特别是UI.最差的UI, 体现了团队的组织架构:其次, 体现了产品的内部结构:最好, 体现了用户的自然需求.在 ...

  3. 利用HTML和CSS设计一个静态的“小米商城官网首页”

    一.小项目说明 这是个例行的小项目练习,主要利用html和css的基础知识,复刻一个缩减版的小米商城网页.包括[导航栏].[头部logo区,快捷键.搜索框].[网页主体].[网页尾部]几个部分.目前只 ...

  4. [干货]Chloe官网及基于NFine的后台源码毫无保留开放

    扯淡 经过不少日夜的赶工,Chloe 的官网于上周正式上线.上篇博客中LZ说过要将官网以及后台源码都会开放出来,为了尽快兑现我说过的话,趁周末,我稍微整理了一下项目的源码,就今儿毫无保留的开放给大家, ...

  5. [Android]官网《monkeyrunner》中文翻译

    以下内容为原创,欢迎转载,转载请注明 来自天天博客:http://www.cnblogs.com/tiantianbyconan/p/5050768.html 翻译自 Android Develope ...

  6. Windows Azure HandBook (7) 基于Azure Web App的企业官网改造

    <Windows Azure Platform 系列文章目录> 1.用户场景: C公司是全球大型跨国连锁餐厅,在世界上大约拥有3万间分店.其IT系统主要部署其海外数据中心,或者租用其他ID ...

  7. 跟着官网的例子学Reacjs (一)FilterableProductTable

    最近开始学习React,发现最好的方法不是看这个书那个书,而是直接上官网,一步步的跟着学习,真的获益匪浅.许多翻译的书上漏掉的知识点都可以学到. 入门的一些准备工作可以参照官网的步骤,引入依赖的核心包 ...

  8. Knockout.Js官网学习(简介)

    前言 最近一段时间在网上经常看到关于Knockout.js文章,于是自己就到官网看了下,不过是英文的,自己果断搞不来,借用google翻译了一下.然后刚刚发现在建立asp.net mvc4.0的应用程 ...

  9. 乐视手机1S正式发售,乐视商城官网抽风遭网友吐槽

    乐视手机1S正式发售,乐视商城官网抽风遭网友吐槽 10月27日,乐视召开的新品发布会上正式推出千元金属新机乐1s,售价1099元.今天11月3日上午10:00,乐1s在乐视商城.京东商城首发开卖,现货 ...

随机推荐

  1. ArcGis Classic COM Add-Ins插件开发的一般流程 C#

    COM add-ins是我对这种开发方式的称呼,Esri的官方文档里称其为“Extending ArcObject”或者“Classic COM extensibility”,Esri所称的addin ...

  2. ado.net 之 oracle 数据库

    ado.net 操作oracle 数据库 跟操作mssql 的原来基本一样.只是使用不同的命名空间而已.下面举几个例子: 一. C#读取oracle数据库的表格 ///ado.net 读取table ...

  3. jsonp简介

    jsonp主要是利用script的跨域.简单点说就是像img,css,js这样的文件是跨域的,这也就是为什么我们能够利用cdn进行加速的原因.而且像js这样的文件,如果里面是一个自执行的代码,比如: ...

  4. 两个同级div重叠的情况

    一个div使用了position,自身脱离了文本流,另一个顶上去.

  5. filebeat_config

    Filebeat Prospector filebeat.prospectors: - input_type: log paths: - /var/log/apache/httpd-*.log doc ...

  6. C++实验一

    2-28 #include <iostream> using namespace std; int main() {char x; cout<<"Menu: A(dd ...

  7. CentOS 7 中 Systemd详解

    一.systemd的由来 Linux一直以来采用init进程但是init有两个缺点: 1.启动时间长.Init进程是串行启动,只有前一个进程启动完,才会启动下一个进程.(这也是CentOS5的主要特征 ...

  8. 用JS实现实时显示系统时间

    废话我就不多说了,直接上图和代码了 效果图: 代码视图: 下面为大家附上代码,复制即可用: <!DOCTYPE html> <html lang="en"> ...

  9. mybatis mapper文件里的<set><trim>

    简单介绍:翻看以前在学校写的代码,发现那时候有一个sql写的很有意思,用到了 <set>标签,和我现在写的虽然有点差别,但是效果一样 代码: //mapper里的sql <updat ...

  10. apache 配置反向代理 设置

    1.下载 安装 下载地址:http://httpd.apache.org/download.cgi 将apache 安装到某个目录中 修改conf/http.conf文件 修改配置文件端口  (端口为 ...