Html 为什么这些div样式会破坏我的站点布局？

这是我的主要代码：

/*幻灯片放映*/
身体{
背景色：#150a35；
}
*{框大小：边框框}
正文{字体系列：Verdana，无衬线；}
.mySlides{display:none}
/*幻灯片容器*/
.slideshow容器{
最大宽度：1000px；
位置：相对位置；
保证金：自动；
}
/*点/子弹/指示器*/
多特先生{
高度：13px；
宽度：13px；
边际：0.2px；
背景色：#bbb；
边界半径：100%；
显示：内联块；
过渡：背景色0.6s；
}
.主动{
背景色：#717171；
}
/*褪色动画*/
.褪色{
-webkit动画名称：淡入淡出；
-webkit动画持续时间：1.5s；
动画名称：淡入淡出；
动画持续时间：1.5s；
}
@-webkit关键帧淡入淡出{
来自{opacity:.4}
到{opacity:1}
}
@关键帧淡入淡出{
来自{opacity:.4}
到{opacity:1}
}
/*在较小的屏幕上，减小文本大小*/
@仅介质屏幕和（最大宽度：300px）{
.text{字体大小：11px}
}
/*幻灯片放映*/
/*导航列表*/
正文{页边距：0；}
ul.topnav{
列表样式类型：无；
保证金：0；
填充：0；
溢出：隐藏；
背景色：#7c4dff；
}
ul.topnav li{float:左；}
ul.topnav li a{
显示：块；
颜色：白色；
文本对齐：居中；
填充：14px 16px；
文字装饰：无；
}
ul.topnav li a:hover:not（.active）{背景色：#111；}
ul.topnav li a.active{背景色：#4CAF50；}
ul.topnav li.right{float:right；}
@媒体屏幕和屏幕（最大宽度：600px）{
ul.topnav li.对，
ul.topnav li{float:none；}
}














var slideIndex=0；
放映幻灯片（）；
函数showSlides（）{
var i；
var slides=document.getElementsByClassName（“mySlides”）；
var dots=document.getElementsByClassName（“dot”）；
对于（i=0；islides.length）{slideIndex=1}
对于（i=0；i

使用

div {
    padding: 15px 30px; 
    background: #7c4dff;
    width: 430px;
    border-radius: 8px;
}

更改页面上的每个div以匹配这些属性所有5个，不考虑任何类别

您需要更具体地使用CSS选择器

div.thisdiv {
    padding: 15px 30px; 
    background: #7c4dff;
    width: 430px;
    border-radius: 8px;
}

<div class="thisdiv" style="text-align:center">
  <span class="dot"></span> 
  <span class="dot"></span> 
  <span class="dot"></span> 
</div>

div.thisdiv{
填充：15px 30px；
背景：#7c4dff；
宽度：430px；
边界半径：8px；
}

使用

div {
    padding: 15px 30px; 
    background: #7c4dff;
    width: 430px;
    border-radius: 8px;
}

更改页面上的每个div以匹配这些属性所有5个，不考虑任何类别

您需要更具体地使用CSS选择器

div.thisdiv {
    padding: 15px 30px; 
    background: #7c4dff;
    width: 430px;
    border-radius: 8px;
}

<div class="thisdiv" style="text-align:center">
  <span class="dot"></span> 
  <span class="dot"></span> 
  <span class="dot"></span> 
</div>

div.thisdiv{
填充：15px 30px；
背景：#7c4dff；
宽度：430px；
边界半径：8px；
}

这似乎太容易了，但是。。不将该代码添加到头部？将div{}移动到样式表的顶部。剩下的代码在后面。这意味着，将首先应用div{}，然后其他选择器将根据您的调整进行更改。如果将div{}放在样式的末尾，任何选定的div都将被div{}覆盖。。不将该代码添加到头部？将div{}移动到样式表的顶部。剩下的代码在后面。这意味着，将首先应用div{}，然后其他选择器将根据您的调整进行更改。如果将div{}放在样式末尾，则任何选定的div都将被div{}覆盖。我应该如何解决此问题？请阅读我的答案。我应该如何解决此问题？请阅读我的答案。