1.什么是优秀的架构（1）优秀的架构是可预测的（2）优秀的架构是可扩展的（3）优秀的架构可以提高代码的复用性（4）优秀的架构是可扩展的（5）优秀的架构在重构的时候可以维护：refactoring只有在可以改进架构或使代码符合编码标准时才应该这样做。2.Cascading级联是浏览器决定将哪种样式应用于元素的一种方式。特异性衡量CSS选择器识别元素的精确程度。这些选择器（除了通用选择器*）在计算特异性时需要被解析。可以通过给(a,b,c,d)中的每个变量赋值相应的值来得到特异性的程度。(1)如果样式应用了style属性，则a=1，否则a=0。(2)b是ID选择器的个数。(3)c是类选择器、属性选择器和伪类的个数。(4)d是类型选择器和伪元素的数量。3.编写高质量的css(1)添加注释A.每个文件的开头都要加上注释，说明文件的内容。/***此文件包含选项卡组的样式。*选项卡组应该只包含带有选项卡类的元素。*/乙。混淆的属性应该在评论中解释。.tab-group-flush{显示：块；左边距：-12px；/*清除父容器的padding值*/margin-right:-12px;/*清除父容器的padding值*/}(2)换行当结构与多个属性一致时，每个属性占一行。每个语句缩进4个空格。(3)保持选择器简单：如果有多层嵌套选择，最好直接添加一个类(4)高性能选择器：网络浏览器从右到左匹配元素。键选择器（选择器最右边的部分称为键选择器）。选择器仅适用于小写字母。用连接词连接单词。属性按字母顺序列出。当属性值为0时，省略单位。(5)分离css和javascript：在只适用于js的类或ID前加上js-；js中使用class修改元素属性；(6)类名必须有意义(7)对于特殊样式，可以使用条件注释方法4.测试多个浏览器。Gemini（https://github.com/gemini-tes...）项目是由Yandex团队（https://www.yandex.com）开发的视觉回归测试工具。使用该工具，您可以编写脚本，自动截取主要浏览器中的网站屏幕截图，并将它们与基准图像进行比较，并突出显示差异。5.代码组织和重构策略按照样式从最不精确到最精确地组织CSS(1)通用样式(2)基本样式(3)组件及其容器样式(4)结构样式(5)功能样式(6)特定于浏览器的样式（如果需要），例如用于开发的单个css文件/***通用样式*---------------------------------------------*//***基本样式*-------------------------------------------*//*基本样式：表格*//*基本样式：标题*//*基本样式：图片*//*基本样式：list*//*基本样式：table*//*etc.*//***组件样式*-------------------------------------------*//*组件样式：消息框*//*组件样式：按钮*//*组件样式：轮子广播框*//*组件样式：下拉框*//*组件样式：模态框*//*等*//***结构样式*------------------------------------------*//*结构样式：聚落区布局*/1/*StructureStructuralstyle：侧边栏布局*//*结构样式：主区域布局*//*结构样式：个人设置区域布局*//*等*//***功能样式*----------------------------------------------*/比如多个css用于开发的文件|-css/||-标准化样式|||-规范化.css||||-基本样式|||-表格.css|||-标题.css|||-图像.css|||-lists.css|||-表格.css|||-等等||||-组件样式|||-警报.css|||-按钮.css|||-carousel.css|||-下拉菜单.css|||-模态.css|||-等等||||-结构样式|||-layout-checkout.css|||-layout-sidebar.css|||-layout-primary.css|||-布局设置.css|||-等等||||-实用风格|||-实用程序.css||||-特定于浏览器的样式|||-ie8.css应用CSSDig，它是谷歌Chrome浏览器的免费插件，可以分析css源文件和不可分析的文件。补充说明：伪类和伪元素的区别：（1）伪类的作用可以通过添加实际的类来实现。em:first-child{color:red;}伪元素的效果可以通过添加实际元素来实现p::first-letter{color:red;}(2)为了区分两者，css3已经明确规定伪类用一个冒号表示，而伪元素用两个冒号表示。(3)伪类与真实类一样，可以叠加。伪元素在一个选择器中只能出现一次，并且只能出现在末尾(4)伪类包括：first-child,:linkvisited,:hover,:active,:focus,:lang等伪元素包括：：第一行，：首字母，：之前，：之后
