风管 用于空气输送和分布的管道系统
注塑机 将热塑性塑料或热固性塑料利用塑料成型模具制成各种形状的塑料制品的主要成型设备
电机定子 电动机静止不动的部分
立绕机 实现立绕过程（制作螺旋丝的一种绕线方法）的一种机器设备
嵌扩一体机 绕线机器设备
单邦机 线材设备
插纸机 插槽纸，实现线和铁芯的绝缘效果
交换机 为接入交换机的任意两个网络节点提供独享的电信号通路
企业的生产计划是由上层管理系统ERP来完成，而车间排产计划则是由MES的计划管理系统来完成
AGV 装备有电磁或光学等自动导航装置，能够沿规定的导航路径行驶，具有安全保护以及各种移载功能的运输车
ATE 集成电路自动测试机
BOM 物料清单
CAD 计算机辅助设计
CAE 有限元类、Adams虚拟样机类、磁场计算类等仿真计算
CAM 计算机辅助制造
CAPP 加工步骤规划
CMC 协同制造商务
CCD 电荷耦合器件，可用于光学成像
DCS 分散控制系统
DNC 分布式数控
ICT 信息通信技术
JIT 准时生产方式
MES 生产信息化管理系统，执行制造系统
MDC 车间的详细制造数据和过程系统
MRP 物质需求计划
OEE 设备综合效率
OEM 原始设备制造商
PCB 印制电路板
PDM 产品数据管理
PLC 可编程逻辑控制器
RFID 射频识别技术
SCM 供应链管理
SFCS 生产现场管理系统
SMT 表面贴片技术
SPC 统计过程控制
WC 生产单元分配
WIP 资源分配和状态管理
WMS 仓库管理系统
<html lang="en"> //英文网站
<html lang="zh"> //中文网站
meta
元素可提供有关页面的元信息（meta-information）<meta charset="UTF-8"> //字符编码
<meta http-equiv="X-UA-Compatible" content="IE=Edge">
// X-UA-Compatible 是针对 IE8 版本的一个特殊文件头标记，用于为 IE8 指定不同的页面渲染模式。
以最高版本IE来渲染页面
<meta name="description" content="">//页面描述
<meta name="keywords" content="">//搜索引擎关键字
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
//针对移动端设备，设置可视区域宽度为设备宽度；页面首次被显示是可视区域的缩放级别，1.0按实际尺寸显示
maximum-scale用户可将页面放大的程序，1.0将禁止用户放大到实际尺寸之上。
链接的样式
<link rel="stylesheet" href="css/bootstrap.min.css"> <!-- bootstrap全局样式-->
<link rel="stylesheet" href="css/animate.css"> <!-- css动画库-->
<link rel="stylesheet" href="css/magnific-popup.css"><!-- 响应式弹出层和对话框组件 灯箱效果 -->
<link rel="stylesheet" href="css/font-awesome.min.css"><!-- 字体图标库 -->
<link rel="stylesheet" href="css/theme.css"> <!-- 使用codepen编写的样式 -->
<!-- Main css -->
<link rel="stylesheet" href="css/style.css">
js脚本
<!-- SCRIPTS -->
<script src="js/nav.js"></script><!-- 导航栏图标、overlay运动 -->
<script src="js/jquery.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/jquery.parallax.js"></script><!-- 滚动视觉差 -->
<script src="js/jquery.magnific-popup.min.js"></script>
<script src="js/magnific-popup-options.js"></script> <!-- 灯箱效果-->
<script src="js/smoothscroll.js"></script><!-- 页面的平滑跳转 -->
<script src="js/wow.min.js"></script><!-- 页面滚动动画 -->
<script src="js/custom.js"></script><!-- 视差与预加载消失 -->
body
<body data-spy="scroll" data-target=".navbar-collapse" data-offset="50">
//滚动监听（Scrollspy）插件，即自动更新导航插件，会根据滚动条的位置自动更新对应的导航目标。
当计算滚动位置时，距离顶部的偏移像素
px、em、rem区别介绍：
px是相对于显示器屏幕分辨率而言的，对于只需要适配少部分手机设备，且分辨率对页面影响不大的，使用px即可；
em是相对长度单位。相对于当前对象内文本的字体尺寸。如当前对行内文本的字体尺寸未设置，则相对于浏览器的默认字体尺寸。
rem通过它既可以做到只修改根元素就成比例地调整所有字体大小，又可以避免字体大小逐层复合的连锁反应
根据CSS3规范，视口单位主要包括以下4个：
1.vw：1vw等于视口宽度的1%。
2.vh：1vh等于视口高度的1%。
3.vmin：选取vw和vh中最小的那个。
4.vmax：选取vw和vh中最大的那个。
ease
theme.css
.logo {display: inline-block}
/*允许在元素上设置宽度和高度，保留上下内外边距，元素之后不添加换行符*/
@media (max-width: 700px){.logo {margin-top: 0;}}
/*使用 @media 查询，你可以针对不同的媒体类型定义不同的样式:文档宽度小于700px，外边距为0*/
line-height:60px;/*行间距*/
z-index:10;/*元素堆叠顺序*/
margin-left: auto;/*元素右对齐*/
-webkit-transition：translation:ease-out;/*慢出，兼容Safari Chrome*/
text-transform: uppercase;/*定义只有大写字母*/
transition: all 1s ease;/*全部样式1s慢-->快-->慢*/
transition: width 0.5s cubic-bezier((0.22, 0.61, 0.36, 1));/*贝塞尔曲线运动*/
transition-delay: 0.1s;/*过渡效果开始前，等待0.1s*/
transform: translateX(-100%);/*左移隐藏*/
letter-spacing: 4px;/*字符之间的空白*/
color: black !important; /*增加样式权重*/
flex-wrap:nowrap;/*规定弹性元素盒不拆行或拆列*/
flex-basis:auto;/*长度等于弹性元素盒的长度。如果该项目未指定长度，则长度将根据内容决定。*/
flex-direction:column;/*调整主轴方向，按列*/
align-items:flex-start;/*弹性盒子元素的侧轴（纵轴）起始位置的边界紧靠住该行的侧轴起始边界*/
style.css
@import url('https://fonts.googleapis.com/css?family=Nunito+Sans:300,400,700|Playfair+Display');
/*导入google在线字体方案*/
font-family: 'Nunito Sans', sans-serif;
/*定义font-family时,最好在最后加一个sans-serif,这样如果所列出的字体都不能用，则默认的sans-serif字体能保证调用;*/
-webkit-font-smoothing: antialiased;/*字体抗锯齿渲染*/
outline: none;/*没有外边框样式*/
box-sizing: border-box;/*border-box 告诉浏览器去理解你设置的边框和内边距的值是包含在width内的*/
background-attachment: fixed !important;/*背景图片不会随着页面的滚动而滚动。*/
background-size: cover !important;/*把背景图片放大到适合元素容器的尺寸，图片比例不变,超出容器的部分可能会裁掉*/
background-position: center center;/**背景图片起始位置/
border-top-color: #f9f9f9/*设置元素的上边框颜色*/
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
/*自适应布局；次元素为伸缩盒子模型中的伸缩容器；主要针对IE10，加上了-ms-前缀；flex布局格式*/
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
vertical-align: middle;/*元素的垂直对齐方式：位于父元素的中部*/
bootstrap.min.css
bootstrap.min.js
<div class="col-md-offset-1"> //向右偏移一列
magnific-popup.css
jquery.magnific-popup.min.js
magnific-popup-options.js
Magnific Popup官网
//为图片标签类提供弹出灯箱效果
var magnifPopup = function() {
$('.image-popup').magnificPopup({
...
});
};
font-awesome.min.css
Font Awesome为您提供可缩放的矢量图标，您可以使用CSS所提供的所有特性对它们进行更改，包括：大小、颜色、阴影或者其它任何支持的效果。
Font Awesome官网
animate.css
animate.css 是一个来自国外的 CSS3 动画库，它预设了抖动（shake）、闪烁（flash）、弹跳（bounce）、翻转（flip）、旋转（rotateIn/rotateOut）、淡入淡出（fadeIn/fadeOut）等多达 60 多种动画效果，几乎包含了所有常见的动画效果。
Animate.css动画演示及下载
custom.js
jquery.parallax.js Parallax视差引擎官网
wow.min.js
"use strict";//代码在严格条件下执行，不可使用未定义的变量
$('.preloader').fadeOut(1000);//jQuery函数，让预载入标签类淡出
function initParallax(){...}//视差引擎的使用
$('#home').parallax("100%", 0.3); //scallar和friction
new WOW({ mobile: false }).init();//WOW动画初始化，并且不在移动端使用
//使用时在class标签中添加wow，并可以加入 data-wow-duration（动画持续时间）和 data-wow-delay（动画延迟时间）属性
视差引擎函数变量
jquery.js
jQuery官网
nav.js
响应式导航模式
menuIcon.addEventListener('click', () =>{...});//点击时，menuIcon左移-100%消失，0%显示
toggleIcon.addEventListener('click',()=>{...});//点击时，为toggleIcon添加toggle类标签，从而显示该类的样式
smoothscroll.js
页面平滑滚动脚本；滚动切换视差效果 localScroll
jquery.smoothscroll.js github仓库
官网
//初始化所有的 .smoothScroll链接，这里为箭头点击跳转到about标签处
jQuery(function($){ $.localScroll({filter:'.smoothScroll'}); });
jQuery()//jQuery()方法
function($){...}//定义了一个匿名函数，参数为$
{filter:'.smoothScroll'}//匹配指定选择器的元素形成字典
112
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
