如何解决极少的css，多个html,却没有覆盖掉前一个人写的代码？

1.命名一个也不要重复！一个也不要！死抠名字！没有重复！

2.<div class="modal-body pic-main xgmm-pic-main"></div>

可以像上面那样写！比如多个10个html文件，却只有一个css文件且没有内嵌的style代码，那么；

同一个div块，有可能复用，却又有可能更改，那么：

在第一个页面中 <div class="modal-body"></div>

在第二个页面中<div class="modal-body pic-main "></div>

在第三个页面中<div class="modal-body pic-main xgmm-pic-main"></div>

css文件中这样写： (按照从上往下的顺序写)

/*这个可以应用到第一个页面中！*/

.modal-body {

样式...这段代码用作第一个页面使用

}

/*第二个页面先应用.modal-body的样式 再应用.pic-main 的样式 若有相同(如margin ，则后面的覆盖前面的！)*/

.pic-main {

样式... 这段代码用作第二个页面使用

}

/*第三个页面先应用.modal-body的样式 再应用.pic-main 的样式 再应用.xgmm-pic-main 的样式 若有相同(如margin ，则后面的覆盖前面的！)*/

.xgmm-pic-main{

样式... 这段代码用作第三个页面使

}

注意： 若后面2,3是基于1.html 修改同一个div块的部分样式(如宽高有稍微调整) ，则2,3可以分别加上 pic-main， xgmm-pic-main 来实现并且不影响其他任何页面的样式！！ 若第四个页面 ，没有修改，又想应用第1个页面的样式，那么在html中写<div class="modal-body"></div> 即可！

看到第二个页面的样式差不多，又想用第二个页面的样式，那么在html中写<div class="modal-body pic-main "></div> 即可！

结果如图一：

而且:html引入css的优先级是 后面引入的大于前面引入的！

例如:         <link rel="stylesheet" type="text/css" href="css/index.css">
        <link rel="stylesheet" type="text/css" href="css/public.css"> 若有冲突代码，则后面会覆盖前面的！

这个代码，同时在这两个css文件的最后一行写上，结果如图2.pass-set-fix {
  width: 600px;
}

被覆盖！

越上面！优先级越高！横线划去代表无效， 

但是，遇到这样的问题！那么怎么办？那么看id class 标签 优先级的计算方法！！ 5974与6030...却是5970行在前面