杂项

系统中的电感线圈元件, 虽然不消耗电能, 但是会 占用系统的容量(相当于占用资源但是不做事), 会使系统 的发电量的使用效率降低, 线路损耗增大, 发出同样有功用电量所需的设备容量扩大

将感性元件和容性元件串接在一起的好处是: 感性负载电流 的相位 落后 系统电压(这个是作为参考电压使用的) 90度(理解: "电场先被线圈铁芯吸收, 转变为磁能 然后才有电流, 所以

电感电流的相位更落后"), 而容性负载电流的相位比 系统电压 提前 90 度, 所以 两者如果串联的话, 刚好抵消, 这样整个系统对外 就显示为 阻性. 既不是感性, 也不是容性的.从而使系统

的 有功效率更大.

电感线圈的磁场能 存储在哪里?

• 有的说存储在 磁芯中, 磁芯里面可以看做包含很多的 磁畴(mag'netic domain) 一个磁畴可以看成是一个 微型的 小磁铁, 由于它们的N极和S极排列是随机的, 不规范, 所以相互抵消, 在外加电场(恒流源)的作用下, 在电场-磁场的磁化下, 磁畴排列规范一致, 所以向外显示出明显的 N极和S极磁性来
• 但也有的说, 磁场能存储在 气隙中?

二极管 和三极管的后缀?

后缀都是 -ode [2ud], di-ode [dai 2ud], triode tri-ode [trai 2ud] ,

三极管: 泛指 三个电极的管子? 包括 普通三极管晶体管, 晶闸管? T: transistor?

VT : v可以是 V型 v-type, 或真空管: vacuum ['v2kjum] , 所以 三极管和晶闸管都是用 VT来表示的

VD: v-type diode 是指 v型二极管, 常指 续流二极管.

VT晶闸管, 可控硅, 其实跟 二极管类似, 也是单向导通, 但是跟普通二极管不同的是, 他的导通不是 "天然的", 而是有条件的: 需要在 控制极G 给以触发电流, 导通后, 即使触发电流消失,

vt也持续导通工作. 所以 晶闸管被叫做 触发开关- 带触发点的 二极管开关.

因此, vt也可以用来做半波整流或 全波 整流.

全波整流, 也叫桥式整流, 是指 四个 diode/或 vt晶闸管, 在每一个桥 的 两个元件之间 取一个抽头出来.形成回路.

vd是 续流二极管, 主要是 用在(并联在) 大功率感性负载 电路中, 是给 电感元件的 反向 感应电动势 提供一个 释放电流,消耗电流的回路, 防止 大功率电感的反向感应电动势 (可达1000v)击穿损坏 电路中的 (超过三极管等元件的反向击穿电压)三极管等元件.

感应电动势的方向?

感应电动势的特性是: 总是 企图 维持 原来的电流(方向不变), 因此, 感应电动势 必然跟 外加的 电路电压的方向是相反的, 所以叫 反向 感应电动势.

而 vd 续流二极管是工作在 "正向导通"的 状态下的, 所以, vd总是 跟 原来的 (系统电压方向 )电路 反向 并联的.

为了保护 续流二极管本身, 有事 也需要在vd中 串联一个 限流电阻(电阻的作用 就是用来 分压 限流的 )

---

常说的 "双导航"就是 所谓的 "双排导航", 导航分为两排, 实际上对于一些大型网站, 导航更多,可能被分成 三排/四排 等之多.

但是对于一些 小型的 简单网站, 是不需要 双导航的.

不要轻视模仿, 关键是 要 吸收消化 并有所提高. 创新是建立在模仿的上的...

作为 页面设计者, 必须要懂得 首页/主页设计 的 一些 准则...

所谓的扁平结构, 是相对于 纵深结构/树形结构而言的, 扁平的话, 它的目录层次比较少,比较浅, 文件基本上都放在根目录下, 对于网页的扁平结构来说,就是指 大多数内容都直接放在/呈现在首页上... 而没有过多的一级目录/二级目录和页面等.

网站主页的设计 可以参考: https://www.wenku1.com/news/446427D0AB63F06C.html 网站主页设计所要 解决的12个任务

网站服务包括 网站的内容 + 网站的功能.

内容是指直接呈现出来 的, (我能在这里找到什么),

功能是 指 业务逻辑的 处理, 需要业务模块的支持(我能做什么?)

网站要给出网站内容和功能的概貌, 服务是怎样组织的, 这项工作通常是由导航(栏) 来实现的.

总之, 网站正式开始写之前, 你得先要设计好 网站的 目录结构和 导航(链接)结构. 这些结构的设计, 总的出发点就是 "这样做, 是否对用户浏览有利, 是否对用户体验有利, 而不只是考虑 是否对自己有利 对自己(赚钱)有利?"

网站目录和链接的 设计, 一切要从用户的角度 出发. 比如

• 凡是用户不会点击的 目录和链接都 "是没用的"??, 都应该删除和更改.
• 目录设计和链接层级 都不应该 超过3层. 链接 "尽可能" 扁平化, 是为了 方便 搜索引擎 收录 网站的内容 (蜘蛛更喜欢扁平化网站)
• 对一些企业网站\ 个人介绍性的 等小网站, 目录不宜过细, 应该给 "网站"瘦身, 过细反而不容易找到 用户需要的信息.
• 小网站 不建议左侧导航和下拉框
• 要始终 从用户的角度考虑, 能让用户减少点击次数, 直接呈现的内容, 就不要设计得太深, 只有这样才能让目录结构/和 首页结构 设计得更合理.才利于seo优化和网站排名.

大型网站的架构优化?

• 因为数据库和 web应用, 放在同一台服务器上的话,它们会相互影响, 导致响应变慢. 所以, 首先要从物理上分离数据库和应用, 部署在两台机器上, 虽然技术上没有什么改变, 但是确实会起到效果.
• 使用squid机制. 当 client 请求对数据库的操作太多, 会引起数据库 连接竞争激烈, 数据操作过多引起响应变慢, 但是又不能把数据库连接数开得太多, 否则会引起数据库的操作压力. 所以 需要 把对数据库的操作结果 缓存起来, 以后再遇到同样的数据操作请求, 就可以直接发给客户端, 不再做数据库连接和操作.

squid是一种缓存代理服务器 = 代理proxyer +缓存cache, 把client 对 服务器的请求 拦截下来, 让squid服务器 去向目标服务器请求, (这其中就有数据库连接和操作等), squid服务器获得数据后, 一方面将结果发送给 客户端, 另一方面 会将结果 cache缓存起来...下一次接收到同样的客户端请求时, 就把保持在 "内存"中的 数据发出去. squid支持 http, ftp, gopher和 ssl 协议等.

• 除了使用squid动态缓存外, 还可以使用 esi/ESI (也是一种缓存服务器) 静态缓存
• 最后就是 再增加一台 webserver应用服务器 做流量分流, 和负载均衡等

整个目录结构, 包括:首页　＞　一级页面　＞　二级页面（注意首页（只有一个页面）　不是　一级页面). 链接结构有　＂星状　和　树状　＂链接结构．通常　首页和一级页面之间用　星状链接结构，　而一级页面和二级页面之间用　树状 链接

关于images目录, 不应该将所有的图片 都放在 根目录"/"下, 或 全部都Public目录下, 应该按 模块Home\Admin, 或主栏目 分别进行存储. 分别创建image目录, 这样便于维护和管理?

---

transform: 变换

css3中的transform主要有四个值: translate平移, rotate旋转, scale缩放,skew扭曲.

主要有两种单位, 一个是px, 一个是度数 degree: deg

一般有两个方向上的数值,如果只有一个, 则第二个数值默认跟 第一个数值相同.

样式需要分别对chrome firefox等浏览器单独定义吗?

• 如果你的项目 指定使用 "现代浏览器" + "w3c标准浏览器" 则不需要单独定义
• 如果是 css2的样式 , 很成熟很常用的属性了, 就不需要单独定义, 主要是针对 css3 比较新的样式 , 则需要单独定义 比如: -webkit-box-shadow, -webkit-box-sizing 等
• 如果你的项目 需要兼容低版本的 浏览器 则需要单独 分别 定义
• 如果要单独定义, 则 要加上 以 横线开头的前缀 -webkit, -ms -moz, -o等

关于css3的box-sizing样式? 参考: http://www.cnblogs.com/liuminghai/p/4293254.html

• content-box | padding-box | border-box | inherit 意思是 如何计算div 的 box宽度 方法. 只影响宽度, 不影响高度
• box-sizing是指 样式属性的 width 包含哪些部分. 这样不同的 box-sizing box计算方法所得到的区块将不一样, 这个将影响 (如果block的 padding , border-width 等属性改变时, 是否影响 区块的 整体宽度, 是否会对周围的元素 产生影响? 是否影响里面的内容 的宽度...)
• 浏览器默认的 一个块block所占的宽度是: width属性值 + padding的值 + border的宽度值 + margin宽度值, 但是 使用 box-sizing后, 元素的宽度 就会发生变化了, 这个box-sizing样式是用来规定 div/block 元素的 width属性值将包含哪些范围.
• content-box 是指 width属性值 只包含 内容的宽度, 这个跟 浏览器默认的计算方法是一样的. 是默认的 值
• padding-box是 指 元素的 width属性值 将应用到 padding 内边距 所包含的区域, 即 width属性值 将包含 内容区域的宽度 和 左右padding的宽度, 这样原来默认的内容区域的宽度 将 会被 减少.
• border-box是 指 元素的 width属性值 将应用到 边框线所包含的区域, 即 width属性值 将包含 内容区域的宽度 加上 左右padding的宽度 再加上 border的宽度值 , 这样原来默认的内容区域的宽度 将 会被 更大程度的 减少. 比如 原来width=100px的元素, 如果padding=10px border-width=5px, 加上 box-sizing: border-box样式后, 其内容区域 的宽度将是: 100px - 10px2 - 5px2 = 70px

---

通常, 网站首页的组成: 顶端是 header(主要包括logo和网站导航 和重要功能) 然后是 主体 main(通常main 分成 两栏结构), 左边是主要内容右边则是一些 小块的 分块区, 这些分块区则是 网站内容的 导读, 或 快捷功能区等. 比如 ??dn的页面布局就是这样.

有时候, 左边可以是一些 小条的 窄条的 功能快捷方式, 也可以没有.

通常, 网站的header区域是 贯穿的, 是整个屏幕宽度的100%. 而主体部门的宽度 则不会贯穿, 两端 应该 有适当的留白.

而main主体部分的背景颜色, 应该/最好是有一点 很浅的灰色, 比如 #eee, 而实际元素的背景用白色, 这样主体内容展示框和 右端的分块区 的 边框线和 区域分割 划分就很明显. 比如 github的配色就是这样的

网页设计要讲究 编排和布局. 要事先画出 页面的编排. 可以用手工在纸上画出, 也可以用软件画出.

网页版面布局主要是指网站的主页的版面布局, 其他页面的版面跟主页的版面布局是一样的

多级级联下拉选择框插件? 参考 https://blog.csdn.net/westonduo/article/details/48006413#!/_zfv8jiwf1sb57b9 下载地址 https://github.com/tuopula/jquery_chained

• 网址 github是单数, 最后的地址是下划线 jquery_chained , 虽然引用的文件是分开写的: jquery.chained.js 和 jquery.chained.remote.min.js (这两个版本, 前面的 jquery.chained. 是相同的, 只是后面的不同...remote.js)
• 使用在github上的 tuupola的插件, 有两个版本, 本地的不需要ajax的版本是 jquery.chained.js, 如果是ajax远程获取数据的用jquery.chained.remote.js
• js中 使用两个 选择框的id来 "链接" 而不是选项, 比如 select id="s1"... select id="s2" 那么两个选择框链接起来的js就是: $('#s2').chained('#s1') <==> $('#s2').chainedTo('#s1')
• 要想使两个选择框 链接, 则要通过class, 要使第二个选择框的option 加上class属性, 而且class 要等于 上一级select中option选项的value值.
  
  这个js插件 就是根据value和扫描下一级select中的option 的class属性, 来决定下一级 哪些选项要显示出来.

下一级option的类class 有几种情况:

一是只在某一个上级option的选项中出现, 那么这时候 class就只有一个值

二是, 下一级的option 对应 多个父select选项, 即下一级的某个option 可以在多个 上一级select/option选项选中的时候, 出现, 那么下一级的option的class 就包含多个对应的类: 比如<option class="s1_v1 s1_v2" value="s2_v1">s2的第一个选项</option>

三是, 第三级的选项, 必须同时对应指定的 第一级和第二级指定的选项值, 那么此时第三级的 option的class 要写成 <option class="s1_v1\s2_v1" value="s3_v1"> 第三级的某个选项</option>

• 如果是使用 ajax 远程访问, 则要使用 remoteChained方法: $('#s2'). remoteChained('#s1', '/remote/ajax_return.php');

• 如果是远程ajax返回 则只需要把第一级的select中的option选项书写 完整, 下一级的select, 就不写opton了, 因为这些option将会被ajax返回内容所填充.

script标签的属性?

• id属性? 事实上, 任何html标签都有id属性, 甚至 像 link/css标签, js标签等都有 id属性值(做动态引用link/css或 js)通过id来定位文件?
• script的所有属性 包括 [type, src, charset]]等 都是可选的 即你完全可以不写任何 属性值! 而且像charset等都是 "废弃" "通常被浏览器所忽略"的属性.

markdown的代码段中, 可以 根据不同的 语言,比如c/java/.net/php/c++等 有 不同颜色的关键字高亮, 使用的是 "syntaxHighlighter.js"插件, 所以可以在 引导符 后面加上 语言名称.下面是两端 加语言名称和不加语言名称 对高亮解析的不同(第一个是加html语言名称的)

<div class="foo"> foo</div>

<div class="foo"> foo</div>

---

网页的版面布局有多种, 比如: 厂字型, 回字型,同字型,三字型, 框架型等, 根据你的需要选择合适的版面.

如果一个元素同时有 aria-label和 aria-labelledby的属性, 那么读屏软件会优先读出 aria-labelledby的内容.

这些属性都是为读屏软件这些辅助功能提供的...

bs的 .show和.hide类, 能够实现类似jquery显示和隐藏的动画, 但是它并没有用js, 而是直接用的 css的 display: block !important 或none来实现的.

???bs中的.text-only类 将页面元素所包含的文本内容 替换为 背景图? 事实上, 是没有 text-onlya这个类的?

关于css的伪类和伪元素?

1. 伪类是用在css中, :before之类的表示的, 而 伪元素是在 html中, 用 ::befor来表示的 而为了兼容都用 一个冒号表示

2. css的伪类 是 像幽灵一样的存在,但是其效果 对用户来说, 是真的 存在的, 而且可以在 元素的 开头 插入内容和图标等, 而且插入的内容在页面的html源码中是不可见的, 只能是在 css里可见

3. 伪类必须有content属性 哪怕这个属性是空的 '', 或只有一个 空格' '. content属性的值包括: none, normal, 实际的字符串"...." 还可以是一些特殊值, 比如 attr(title, href)等. 内容可以直接拼接, 不用任何运算符号的

4. 比如: h1:before{content: url('some/icon.jpg');} 经常看到 网页中 , 统一的, 在所有的h1标题前 都插入一个 小图标.

---

在ff中的调试面板中, 鼠标箭头符号只是用来pick 元素的, 此时box model的computed 并不会显示当前被选择的对象的 尺寸, 只有当你 单击了这个元素后 , 被inspector后, 才会显示 元素的 computed尺寸.

bs的 container类样式 只是 : left/right-padding:15px; 上下padding=0; | 上下margin=0; 左右margin: auto

所以 container类本身是没有 边框的!

#### 在css样式中, 要引用/表示图片, 需要用 url('图片地址')的方式, 不能直接写 '图片地址'的方式. 比如: `background-image: url('...'); `
- 而且, 样式表中的样式, 并不是添加到 使用样式的html文件中, 而是 仍然放在 css文件中的.
- 因此, 样式表中的 图片相对地址 (即url图片地址) 要相对于 当前这个css文件的路径(这个相对关系是固定的), 而不是 相对于要使用的 html文件的路径, 因为使用css样式 的html文件可以是任意的不同位置处的文件.

关于元素的背景图片background-image样式?

• 背景图片的重复/平铺, background-repeate: 有四个值: repeat, no-repeat, repeat-x, repeat-y.

• 背景图片的位置: background-position: 关键是要知道 这个位置是指(两个点的偏移offset): 背景图片的左上角 相对于当前元素的box模型的左上角的 偏移offset位置, 几种指定方法: 一是使用关键字: left/center/right, top/center/bottom, 二是使用 具体数字 如10px 20px等 而且 关键字和 数字的表示方法可以混用.

• 背景图片的固定? background-attachment: scroll, fixed....

• 如果要使用 元素样式的 集中写法, 必须写这个元素的 "集中属性", 而不能使用它的 分属性, 比如: background: url('...') 0px 5px scroll no-repeat, 但是不能写成: background-image: url('...') repeat-x 也就是说 集中属性的写法 和 分属性的写法不能混合着写:

• 背景图片属性的说明顺序是: cipar: color-image-position-attach-repeat.

伪类/伪元素:before 和 :after 的之前和之后是什么?

直觉是:before 伪元素是 插入的内容 会被注入到目标元素的 前面或后面. 但是实际上不是这样的: 伪类注入的内容将是 有关联的那个目标元素的子元素, 但是它会被置于这个元素的任何 子内容的"前"或"后"

---

div本身没有语义上的含义, 要尽量使用具有 语义的标签和类, 比如header, footer,nav, article等标签

bs中的article标签标识一篇文章, 一个帖子, 通常包含 header, (h2 p) +内容. article也可以放在页面的尾部

section是article中 用来分隔另一个区块的内容

hgroup: 当有多个具有 层级关系 的标题(比如一级标题h1, 二级标题h2, 三级标题h3 或者一个主标题一个子标题)的 时候, 就应该使用hgroup

来包含.

hgroup的css样式很简单, 他就是一个 display: block的块

• One's whole mind is concentrated on one thing only.
• I take only what i want, I don't care about anything else.

完全用h5 来写页面, 要有完整的结构, 随时随 处 都能说出标签明确的语义

h5的代码在 ie9以下都是没有效果的, 调试h5 还是要在ff和 chrome下比较好.

!important本来是css的标准语法, 表示优先执行, 但是ie6不能认,所以就用两条语句来解决兼容性的问题,比如

.foo{padding-left: 30px !important; padding-left: 20px; } 那么就能实现 在ie6下左边距 20px, 而ff下左边距30px

以 .table- 开头的类, 都是用在table标签上的, 非-table开头的只能应用在tr 或td上

table中 如果使用 thead 或者 tbody 来从语义上分隔,那么在 表头和表体之间会出现一条 比较粗的 实线来分割.

凡是 以 -responsive 结尾的类都是 响应式的.

作为一个统一的样式和 主题来说,

• 比较经典的边框的灰色是 #ddd
• .table-hover类 和 当项目被激活时的 .active类的背景颜色是 #f5f5f5的浅灰色.

html本身也是一个标签元素, 你可以在ff中看到它的box model

bs的container 是如何确定宽度的?

• 虽然在 .container的样式中, 只是规定了left-right/padding-margin, 并没有规定宽度, 但是 div.container的容器并没有占据100%的屏幕宽度,而是只占了中间的一部分宽度(比如1600px的宽屏实际上只占据了 居中的170px)
• 是因为 .container被定义了 媒体查询, 实现了响应式布局

响应式布局? 又叫媒体查询

• 可以根据 媒体类型 来定义不同的样式, 即对于 不同的屏幕宽度(不是显示器的宽度), 应用不同的样式
• 完整的格式是: @media mediatype [and|not|only] (media feature) { 具体的标签/类/id的样式{ ...} } 而很多时候, 可以使用简写的媒体查询, 省略 metiatype 和逻辑词, 直接就是 : @media (media feature) { ....}
• mediatype是媒体类型, 很多都已经废弃了, 主要的有all, print,screen, speech. and|not|only是 逻辑关系, 表示媒体类型和媒体特征同时满足条件等, media feature标识媒体特征或 媒体功能,包括很多, 比如 width, height, min/max-width, min/max-height等等. 可以有多个媒体特征(条件), 用and 来连接: 比如:

/* 手机等小屏幕手持设备, 下面有两个and  */

@media screen and (min-width: 320px) and (max-width: 480px) {   还是 (min-height: 480px)????

body {

background: yellow;

}

}

• 所以 @media screen and (min-width: 1200px) { .container{ width: 1170px;} } 简写成 : @media (min-width: 1200px) { .container { width: 1170px; } } 就标识 浏览器最小宽度是1200px的时候, 即: 浏览器宽度大于1200px的时候, 使用 里面的样式.

• 注意两个问题: 可能有一种错觉: 以为媒体查询中的宽度, 指的就是你显示器的宽度, 所以以为宽屏的显示器的.container的宽度总是固定的那么多1170px. 实际上这是错误的, 这里的"屏幕宽度" 指的是 : 浏览器的"屏幕"宽度! 所以, 即使是在 宽屏的显示屏中, 当你不断调整\缩小浏览器的宽度时, 你可以看到 container的宽度是 在不断改变的.

• 有三个媒体屏幕宽度的等级, .container的宽度略小于 宽度等级:min-width: 768px 对应的是 750px; min-width: 992px 对应的是 970px; min-width: 1200px 对应的是 1170px; min-width的媒体特征后面是冒号, 不是等号.

• 实际上ff浏览器 在调试宽屏的显示效果的同时, 还支持 手机等 窄屏的设备的 responsive design mode. 可以直接在ff中 看到并调试手机上的显示效果,就不需要安装什么手机模拟器了.

---

bs中要表示代码, 使用 code pre标签, 其中的尖括号要用实体 转义

代码要实现滚动, 使用 pre.pre-scrollable 类

shell中命令的优先级 : 别名 > 函数 > 命令

类lead, text-center text-muted等都是用在段落 p标签上的

文本是否自动换行 text-justfied text-nowrap

h5中的缩写标签是 <abbr> 其样式是在文本底部的一条虚线边框, 当鼠标悬停在上面时, 会显示完整的文本(文本就是abbr的 title属性的内容).

为了获得一个更小字体的文本, 需要添加 .initialism类到abbr

address标签显示 联系地址, 内部用br换行,

blockquote引用的格式 是在旁边画一条竖线,

.pull-right 类 是显示在右边

cite标签, 在html4和h5 中是不同的语义, h5中表示的是 作品的题目, 比如书名

列表的类型有 ol, ul, dl. dl是自定义列表项, 它跟ol, ul不同的是, 不只是包含列表项, 而且还包含列表项的说明内容. 使用 .dl-horizontal类

可以得到水平的列表项.

关于script的位置, 通常来说, 是放在head中的, 但是, 推荐还是 放在body的最后, 很多大站都是这些写的

应该养成严谨的习惯, html中所有的内容 都应该放在 标签中

以前的h4标准中, 自闭合标签br hr input的尾部都要加斜杠, 说是为了严谨. 但是 现在变了, 在h5中, 推荐在 自闭合标签br hr input的尾部都不

加结尾的斜杠了! 因为h5会认为是错误的标签,然后就会在父元素的结尾处去寻找结束标签, 但这样显然是不合理的.

url结尾是否要加斜杠?

• 首先要搞清楚, 加斜杠的目的是什么? 斜杠是标识的是目录!
• 因此, 如果你是访问的一个文件, 就不能加结尾的斜杠
• 反之, 如果是访问的一个目录, 就最好是加上. 因为如果不加斜杠, 浏览器默认的把当前请求 会当作一个普通的文件去访问, 当觉察到不对(即在

那个位置找不到这个文件的时候), 会做一个301的重定向, 自动在访问地址后面加上斜杠作为目录访问, 这时候就是第二次请求了, 这样的话, 在某

些语言中编程就会出错. 比如 在 request.getParameter代码就会获取不到请求参数, 因为request.getParameter的生命期只有一次, 只有在第一

次请求中有效, 在重定向后的第二次请求中就无效了.

在版本修改过程中的version和revision的区别?

• version是软件在开发过程中比较成熟的一个版本;
• revision [ri'vi32n], 修订版, 通常是在软件的开发过程中的一些修订, 在同一个version版本中, 可以有多个修订版revision.

在同一个栅格系统的列div中, 可以同时指定多个不同宽度的列宽类, 比如: div.container > div.row > div.col-sm-6 .col-md-4.col-lg-3

bs的列是有顺序的, 默认的是按书写的先后次序排列的, 如果要调整 列的左右先后顺序, 可以使用 类.col-md-push-?? (向右推移动) 或 .col-md-

pull-?? (向左拉移动)

有col-xs, sm, md, lg四个等级的屏幕尺寸, 这些尺寸不是任意的, 在你写 col-md-??的时候, 就基本上固定了

小于 768px 的时候，用 col-xs-12 类对应的样式；

在 768px 到 992px 之间的时候，用 col-sm-9 类对应的样式；

在 992px 到 1200px 之间的时候，用 col-md-6 类对应的样式；

大于 1200px 的时候，用 col-lg-3 类对应的样式

glyph 的英文意思: '象形文字, 象形符号', 而glyphr 就是 linux下 设计字体的软件, 所以 glyphicons就是象形图标了.

由less 到 css的过程也叫 编译, 相当于 c++ java等源文件\ obj文件 到 exe文件的编译过程.

关于bs中的图片 类?

• 整个的图片标签 是垂直方向上居中的 img { vertical-align: middle; }

• 而响应式图片 .img-responsive 和 轮播器中的图片 都是: display: block; max-width: 100%; height: auto; /* 这样的css就是 宽度和高度 自动适应 */}

• 对于 响应式图片, 要实现水平居中, 必须 在 img标签的本身 上, 再添加 center-block 类. 不能在 img的父元素, 比如p或div上加类.

bs栅格类型的边框线?

• 栅格系统, 默认的是没有边框线的, 要设置边框线, 必须但对添加另外的类样式, 比如下面的 .show-grid
• css 的选择器和 jquery中的用法 完全一致, 同样支持 属性选择符, 和 ^= 等运算符的.

<style type="text/css">

        .show-grid [class ^="col-"] {

            padding-top: 10px;

            padding-bottom: 10px;

            background-color: #eee;

            border: 1px solid #ddd;

            background-color: rgba(86, 61, 124, .15);

            border: 1px solid rgba(86, 61, 124, .2);

        }

        </style>

bs的类样式 .img-responsive的意思究竟是什么意思?

: 就是使得 img图片的宽高 能够自动缩放, 自动适应父容器的缩放比例的, 因为它的css样式就是 .img-responsive{ max-width: 100%; heigth: auto; }

但是还得要求, img的父容器 是自动适应的, 要求父容器的宽度是百分比的 比如 div{width: 50%} > img.img-responsive

另外, col-SCREEN_TYPE-???后面的数字怎样写?

• 首先要明确, 屏幕越宽, col 最后的数字应越小 比如同一个 图片对象的 对应 列宽类样式: col-xs-12 col-sm-6 col-md-3 col-lg-1
• 是因为, 假设针对 同样宽度的一个 对象, 屏幕越宽, 一个列的"单位宽度"越大, 放置这样的对象 所需的列的数量就越少; 所以 col-md-3的宽度 可能就只需要1个 lg的宽度了: col-lg-1

什么是301 重定向?

• 是请求返还的header 信息状态之一, 404 是没有, 500+ 表示的是 服务器(内部)错误, 即内部程序错误
• 301是 永久性重定向 302 是临时性重定向
• 301重定向 会 传递大多数的权重, 完成权重的传递一般需要1到几个月
• 301重定向 主要用在几个场合: 网站内容/目录结构改版; 网站域名改变; 企业申请的多个域名 要指向同一个 主域名时(否则会认为内容重复而被 搜索引擎处罚)
• 301重定向的实现方式有: html重定向 <meta http-equiv="refresh" content="0; url=/newpage.html" // content里面的0表示刷新跳转时间间隔, 0标识马上/立即/直接跳转... , 其他脚本语言重定向, 比如 php语言重定向(基本上就是 .htaccess地址重写的那个步骤)

---

分辨率越大, 是说的数值 越大, 在相同的屏幕尺寸, 分辨率越大, 则像素点越多, 更清晰. 一个像素点是指能单独显示颜色的最小单位

1个css像素 不一定等于 1个屏幕 物理像素, css像素是一个 相对值: 跟屏幕像素密度 正相关, 跟用户缩放正相关(当用户屏幕页面放大一倍, 则一个css像素 代表的物理像素 将增加1倍)

bs需要在h5中才能使用, bs3的设计intent是移动设备优先, 所以要声明 viewport的meta: <meta name="viewport" conent="width=device-width, initial-scale=1.0 [maximum-scale=... , minimum-scale=..., user-scalable=no 用户是否可以缩放]"> 注意, viewport的内容值之间用 逗号而不是用分号分隔.

css中的 @charset utf8; 中间不能用冒号或等号, 最后还必须用分号; 否则这条声明无效, 相当于没有声明一样, 而且在编辑器中还会高亮错误. 还是会按 英文字符集来显示.

<ele class="c1 c2"> 的类表示同时具有两个样式, 可以有两种生效方式: 一种是分别定义两个类.c1{...} .c2{...}, 效果是它们的综合相加; 另一种是同时定义两个 类样式 中间没有空格 .c1.c2{...} 这两者方式中, 如果有样式重复的, 后者样式会覆盖前面的那种定义的样式. 但是 .c1 .c2{...} 中间有空格的形式是不能对这个元素生效的

修改bs 的默认样式, 如果要全局修改, 可以直接修改, 覆盖, 比如 .container样式, 但是如果只是覆盖某一个的话, 可以在这个类前面加上一个任意的 类样式比如.foo; 然后用复合类的方式来定义覆盖. 比如: .foo.container{...}

对于网站的资源, 可以用相对路径,也可以用绝对路径. 如果用绝对资源, 根路径就是 "/" 网站的根路径就是指网站的 根目录, 即wamp的www, 或apache的根目录html.

select的默认选项值是提示, 是占位符, 所以它的value值就等于空 <select><option value="">请选择</option>

写html的时候, 如果是你自己写css的话, 就是 先要写好布局和 站位的内容, 然后再写css和js.

但是, 如果是用前端框架, 那么在写内容的时候, 就想好用什么组件和框架布局了, 一起写的

完整的表格结构是: table=thead(tr>th) + tbody(tr>td) 要注意, thead和tbody还有语义上的 含义和区别, 在thead和tbody之间 会有一条加粗的分隔线. 否则如果没有thead, 那么表头和表体之间 就不会有明显的区别和分隔线.

在vim中 冒号命令的 范围起止,不是用冒号, 而是用的 逗号, 比如: 10,20d 另外, 在一些normal命令中, 要善于使用 数词, 比如: dw, cw, d3w c2w等.

在tp中, 实例化对象 传入初始化参数的时候, 可以使用两者方式, 一种是 传统的构造函数参数(初始化函数参数, 即c/c++ 传统语言的方式), 另一种是 使用 "动态参数", 这个是php的特殊方式, 而且要定义 魔术方法 __set(...) 要习惯于第一种方式, 因为第一种方式的效率好像要更高一点.

---

tp中的多级控制器就是在 controller目录下又多了一个子目录, 用来分组存放控制器而已. 默认的是把所有的具体控制器子类 全部都放在 controller目录下, 分级后则按目录存放.

要使用多级控制器,首先要设置 'CONTROLLER_LEVEL' => 2 然后在子目录下创建控制器文件 Controller\User\UserTypeController.class.php , 然后, 相应的,控制器类的命名空间定义就是 namespace Home\Controller\User;

其实, 开发中,一般能够用默认的设置就尽量用默认的设置, 谁也不会故意搞得那么复制, 把自己入坑自己整自己. 所以像多级控制器基本没有什么用.

action和operation的区别

operation强调普通的操作步骤, action是更广泛的含义, military action. mvc中固定的用法是 action.

在tp中, 要定义操作方法,你可以定义不带参数的操作方法(大多数是这样的), 也可以定义带 参数的操作方法, 但是操作方法的参数来源, 传参是一个大问题, 因为你在url访问中, 不可能在url的action中用括号来传参的方式.

• action中的参数 可以来源于从 前台表单中 传递过来的 $_POST $_GET, I()方法等;
• 如果没有前台表单传递参数, action方法中又定义了参数, 那么这个参数也可以从 另一个页面中的 a锚点链接- url地址中传参 来获得. 这个就叫做action参数绑定, 即: action中的参数和url中的参数 名称相对应 而获得.
• 默认的就是action参数绑定开启的, 定义 'URL_PARAMS_BIND' => true, 类型有两者,一种是按名称绑定,默认的, 那么要求名称一定要相同的对应, 顺序不要求; 另一种是 按顺序绑定, 设置是: 'URL_PARAMS_BIND_TYPE' => 1 (0是按名称绑定)
• 应该/始终给操作方法参数设置 默认值, 是防止出错的好方法. 否则, 如果没有在url中设置对应绑定的参数/参数值, 就会报错 "参数错误..."

关于字符串拼接?

• 在php文件中,一种很简单的字符串和变量的拼接方法, 只要在原来的 单引号/双引号的中间, 加上一对单引号和变量就好了, 即: '.$id.'
• 在js中字符串拼接, 使用 加号+
• 而在html中, 要拼接字符串就更容易了, 因为根本就不需要 拼接 , 直接将内容挨着写就是了, 比如: <a href="http://localhost/Home/Index/boot/id/{$id}">click here to jump </a>

js跳转的几种方式

location.href=.... self.location=..// top.location=.... history.back(); histroy.forward().

但是没有 window.navigate(...), 和 history.go(-1)等的写法无效.

---

默认情况下, url地址中的模块不能省略, 如果要简化某个模块的url访问地址, 可以通过设置模块列表和默认模块等.

// 允许访问的模块列表

'MODULE_ALLOW_LIST' => array('Home', 'Admin', 'User'),

'DEFAULT_MODULE' => 'Home',

// 还可以配置禁止访问的模块

默认的Application下的Common模块和Runtime模块是禁止访问的

'MODULE_DENY_LIST' => array('Common', 'Runtime', 'User'),

// 模块映射是为了包含"后台"模块, 禁止用户直接访问某个模块

'URL_MODULE_MAP' => array('test' => 'admin'),

设置了模块映射后, 原来的admin模块将不能访问, 只能访问test模块

如果发生在本地测试正常, 但是一旦部署到服务器环境后就只能访问首页 的情况, 很有可能是 你的服务器或者空间不支持 PATH_INFO这种url模式所致.

通过url重写隐藏应用的入口文件index.php的配置内容

• 首先要确认在apache的配置文件httpd.conf文件中, 加载(开启) mod_rewrite.so模块
• 修改apache配置文件中的 AllowOverride None 为All
• 最后将.htaccess文件放到 和 应用入口文件index.php相同的目录下. 具体内容已有.

关于tp中的目录?

目录 分为应用/项目的 公共目录和模块目录. 凡是属于模块比如Home模块的东西, 就应该放在模块的对应子目录下, 比如Home模块下 的 Lib目录, Behavior目录, TagLib目录等. 在公共目录下也可以有这些子目录, 只是这些子目录是服务于 所有的 模块的.

杂项??

1. tp的 "行为Behavior", 可以让你无需改动框架和应用, 而在外围通过扩展 或者 配置来改变或增加一些功能.

2. 在实际项目开发中, 不是为了验证/实验时, 一般不会故意把项目搞得很复杂, 不会自己整自己, 都会使用 "通用的/常见的/成熟的"方案和技术, 而不会采用激进的技术. 所以很多熟练的人都几乎是 背着写/凭记忆直接就写出 成套的代码了.
   
   类库一般有 公共类库和应用类库, 公共类库主要是放在 框架的 Library\Think\类库中的.
   
   应用类库(即类文件, 比如 CertainApp.class.php文件)一般 都不直接放在根目录下 \html\ 下, 而是要放在 根下的 相关分类目录中
   
   除非特别需要, tp项目的配置都应该保持默认.

3. html中像 <br> <br />等叫做 void elements "无内容标签, 空标签".
   
   在html5中, void tag的 最后的那个 斜杠/ 叫做 "关闭斜杠" 这个关闭斜杠是 "可选"的. 事实上, h5认为最后的这个 关闭斜杠是一个 "错误", 因为标签本来就没有什么内容, 你还要什么关闭斜杠呢? 只是这个 关闭斜杠 是一个 "可以容忍"的错误. 因此, h5提倡 不要写最后 的那个斜杠. 直接写成 <br> <hr> <img src=".." alt="..."> 就好了

因此, 像<p>...</p> <div>...</div> 这些 有 开始 ~ 结束标签, 有 </tag> 的都叫 闭合标签closed tag. 而所有的 空元素/无内容标签 都是 非闭合的.

在Tp框架\Library\Template\TagLib\Html.class.php中,

// 标签定义： attr 属性列表 close 是否闭合（0 或者1, 默认1 即默认是非闭合的） alias 标签别名 level 嵌套层次