<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<!-- 头部样式 -->
<div class="top-x">
<div class="top-box">
<div class="top-left">
<div class="top-logo"><img src="" alt=""></div>
</div>
<div class="top-right">
<div class="top-p"><p></p></div>
<div class="top-span"><span></span></div>
</div>
</div>
</div>
<!-- 导航样式 -->
<div class="nav-x">
<div class="nav-box">
<div class="nav-ul-box">
<ul>
<li><a href=""></a></li>
</ul>
</div>
</div>
</div>
<!-- 轮播图样式 -->
<div class="big-x"></div>
<!-- 网页内容样式 -->
<div class="content-x">
<div class="content-box">
</div>
</div>
<!-- 底部样式 -->
<div class="bottom-x">
<div class="bottom-box">
</div>
</div>
<!--
例:
如果同级遇到相同标签,则用兄弟样式名+英文数字(one,two,three...)代表类样式
如果子标签也是相同标签,则用父类样式名+子类样式名代表类样式
也可以使用nth-child();直接选择span-x:nth-child(2);
-->
<div class="div-x">
<span class="div-x-span"></span>
<span></span>
</div>
<span class="span-xone"></span>
<span class="span-xtwo"></span>
</body>
</html>
如有盒子就用模块名+box
如有中文就用模块名+txt
如有数字就用模块名+number