format code

src/html/ynu.html

@@ -11,7 +11,7 @@
     <div class="w-full h-fit">
         <img src="../../img/bg-top-combine.png" class="w-full" alt="top-blank-logo"/>
     </div>
-    
+
     <div class="flex bg-blue-600 text-white flex-row font-bold justify-around text-center items-center h-16 text-lg leading-16 overflow-hidden">
         <div class="hover:text-red-300">首页</div>
         <div class="hover:text-red-300">新闻公告</div>
@@ -24,7 +24,7 @@
         <div class="hover:text-red-300">学生工作</div>
         <div class="hover:text-red-300">English</div>
     </div>
-    
+
     <!--    <div>-->
     <!--        <div class="w-full h-fit mt-1 relative">-->
     <!--            <div class="w-full h-screen relative flex z-0" id="slider-wrapper">-->
@@ -32,7 +32,7 @@
     <!--            </div>-->
     <!--        </div>-->
     <!--    </div>-->
-    
+
     <!--图片轮播实现-->
     <script src="../ts/slider.ts" defer></script>
     <!-- 轮播图容器 -->
@@ -46,7 +46,7 @@
         <div id="rightArrow" class="iconfont icon-arrow-right"></div> <!-- 右箭头切换按钮 -->
         <div id="sliderBtn"></div> <!-- 切换按钮组 -->
     </div>
-    
+
     <div class="w-full flex">
         <div class="flex w-3/5 flex-wrap">
             <div class="m-4 shadow-lg w-full h-auto rounded-lg border-2">
@@ -68,7 +68,7 @@
                     <li class="hover:text-blue-400">就把电话拔下来给他了</li>
                 </ul>
             </div>
-            
+
             <div class="flex flex-nowrap">
                 <div class="ml-4 mr-1 shadow-lg w-1/2 h-auto rounded-lg border-2">
                     <h1 class="px-3 pt-2 pb-0 text-2xl text-orange-600 font-bold">
@@ -84,7 +84,7 @@
                         <li class="hover:text-blue-400">他按键的速度非常快，但是只按0，1两个键</li>
                     </ul>
                 </div>
-                
+
                 <div class="mr-4 shadow-lg w-1/2 h-auto rounded-lg border-2">
                     <div class="h-auto">
                         <h1 class="px-3 pt-2 pb-0 text-2xl text-orange-600 font-bold flex-nowrap">
@@ -94,7 +94,7 @@
                             </span>
                         </h1>
                     </div>
-                    
+
                     <div class="flex border-2 rounded-lg m-2 p-0 h-auto justify-between flex-nowrap hover:text-blue-500 hover:shadow-lg">
                         <div class="h-16 w-1/2 leading-16 pl-3 overflow-hidden">
                             我渐渐的有些困，我问他这东西要搞多久
@@ -103,7 +103,7 @@
                             <img class="h-16 w-32" src="../../img/picture.png" alt=""/>
                         </div>
                     </div>
-                    
+
                     <div class="flex border-2 rounded-lg m-2 p-0 h-auto justify-between flex-nowrap hover:text-blue-500 hover:shadow-lg">
                         <div class="h-16 w-1/2 leading-16 pl-3 overflow-hidden">
                             他说要几个小时
@@ -112,7 +112,7 @@
                             <img class="h-16 w-32" src="../../img/picture.png" alt=""/>
                         </div>
                     </div>
-                    
+
                     <div class="flex border-2 rounded-lg m-2 p-0 h-auto justify-between flex-nowrap hover:text-blue-500 hover:shadow-lg">
                         <div class="h-16 w-1/2 leading-16 pl-3 overflow-hidden">
                             我给他倒了杯茶，就一个人去隔壁睡觉了
@@ -124,7 +124,7 @@
                 </div>
             </div>
         </div>
-        
+
         <div class="w-2/5 flex-grow mb-4">
             <div class="h-full my-4 mr-4 shadow-lg rounded-lg border-2">
                 <h1 class="px-6 pt-4 pb-0 text-2xl text-orange-600 font-bold">
@@ -149,7 +149,7 @@
             </div>
         </div>
     </div>
-    
+
     <div class="w-fit flex flex-wrap m-4 border-2 justify-around rounded-lg shadow-lg bg-gradient-to-r from-cyan-300 to to-violet-300">
         <ul class="li-img clearfix">
             <li><img src="../../img/anyuse2.png" alt=""/></li>
@@ -162,7 +162,7 @@
             <li><img src="../../img/anyuse9.png" alt=""/></li>
         </ul>
     </div>
-    
+
     <footer class="mt-4 bg-gradient-to-r from-sky-500 to to-indigo-500 text-center p-4 text-white">
         <p>云南大学软件学院 版权所有</p>
         <p>地址：昆明市呈贡区大学城东外环南路云南大学呈贡校区软件学院楼</p>

src/scss/styleBaidu.scss

@@ -2,67 +2,67 @@
 
 /* 设置页面背景色 */
 body {
-	background-color: #f5f5f5;
+  background-color: #f5f5f5;
 }
 
 /* 设置页面内容区域的宽度和居中 */
 .container {
-	max-width: 1200px;
+  max-width: 1200px;
-	margin: 0 auto;
+  margin: 0 auto;
-	text-align: center;
+  text-align: center;
 }
 
 /* 设置百度Logo的样式 */
 .logo {
-	width: 320px;
+  width: 320px;
-	height: 120px;
+  height: 120px;
-	background-image: url("../../img/baidu.png");
+  background-image: url("../../img/baidu.png");
-	background-size: cover;
+  background-size: cover;
-	margin: auto auto auto auto;
+  margin: auto auto auto auto;
 }
 
 /* 设置搜索框的样式 */
 .search-box {
-	width: 450px;
+  width: 450px;
-	height: 45px;
+  height: 45px;
-	border: 1px solid #ccc;
+  border: 1px solid #ccc;
-	border-radius: 20px;
+  border-radius: 20px;
-	padding: 5px 10px;
+  padding: 5px 10px;
-	font-size: 16px;
+  font-size: 16px;
 }
 
 /* 设置搜索按钮的样式 */
 .search-button {
-	background-color: #3385ff;
+  background-color: #3385ff;
-	color: #fff;
+  color: #fff;
-	border: none;
+  border: none;
-	padding: 12px 24px;
+  padding: 12px 24px;
-	font-size: 20px;
+  font-size: 20px;
-	border-radius: 25px;
+  border-radius: 25px;
-	cursor: pointer;
+  cursor: pointer;
 }
 
 nav {
-	background-color: #f5f5f5;
+  background-color: #f5f5f5;
 }
 
 nav ul {
-	list-style-type: none;
+  list-style-type: none;
-	margin: 0;
+  margin: 0;
-	padding: 0;
+  padding: 0;
 }
 
 nav li {
-	display: inline-block;
+  display: inline-block;
 }
 
 nav a {
-	display: block;
+  display: block;
-	color: #000000;
+  color: #000000;
-	text-decoration: none;
+  text-decoration: none;
-	padding: 10px;
+  padding: 10px;
 }
 
 nav a:hover {
-	background-color: #555;
+  background-color: #555;
 }

src/scss/styleYnu.scss

@@ -3,93 +3,93 @@
 @tailwind utilities;
 
 .li-img li {
-	list-style: none;
+  list-style: none;
-	float: left;
+  float: left;
-	width: 25%; /*四列图片排列*/
+  width: 25%; /*四列图片排列*/
-	height: 175px;
+  height: 175px;
-	overflow: hidden;
+  overflow: hidden;
 }
 
 .li-img li img {
-	position: relative;
+  position: relative;
-	width: 100%;
+  width: 100%;
-	height: auto;
+  height: auto;
-	top: 50%; /*li高度的一半*/
+  top: 50%; /*li高度的一半*/
-	transform: translateY(-50%); /*再向上移动自身的50%*/
+  transform: translateY(-50%); /*再向上移动自身的50%*/
 }
 
 /*清除浮动*/
 .clearfix:after {
-	position: relative;
+  position: relative;
-	content: '';
+  content: '';
-	display: block;
+  display: block;
-	width: 0;
+  width: 0;
-	height: 0;
+  height: 0;
-	visibility: hidden;
+  visibility: hidden;
-	clear: both;
+  clear: both;
 }
 
 #carousel {
-	@apply w-auto h-auto relative overflow-hidden justify-center rounded-2xl flex mx-2 mt-2;
+  @apply w-auto h-auto relative overflow-hidden justify-center rounded-2xl flex mx-2 mt-2;
 }
 
 #carousel img {
-	position: absolute; /* 绝对定位 使图片堆叠 */
+  position: absolute; /* 绝对定位 使图片堆叠 */
-	width: auto; /* 设定大小 按比例缩放 */
+  width: auto; /* 设定大小 按比例缩放 */
-	height: auto; /* 设定大小 按比例缩放 */
+  height: auto; /* 设定大小 按比例缩放 */
-	transition: all .6s; /* 动画 */
+  transition: all .6s; /* 动画 */
-	opacity: 0; /* 隐藏 */
+  opacity: 0; /* 隐藏 */
 }
 
 .imgActive {
-	opacity: 1 !important; /* 显示图片 最高优先级 */
+  opacity: 1 !important; /* 显示图片 最高优先级 */
 }
 
 /* 控制按钮的样式 */
 #leftArrow,
 #rightArrow {
-	//position: absolute;
+  //position: absolute;
-	//left: 5px;
+  //left: 5px;
-	//top: 50%;
+  //top: 50%;
-	//width: 25px;
+  //width: 25px;
-	//height: 30px;
+  //height: 30px;
-	//background-color: #eee;
+  //background-color: #eee;
-	//display: flex;
+  //display: flex;
-	//justify-content: center;
+  //justify-content: center;
-	//align-items: center;
+  //align-items: center;
-	//opacity: 0.7;
+  //opacity: 0.7;
-	//font-size: 20px;
+  //font-size: 20px;
-	//cursor: pointer;
+  //cursor: pointer;
-	//z-index: 1000;
+  //z-index: 1000;
-	@apply absolute left-5 top-1/2 w-7 h-11 bg-gray-300 flex justify-center items-center opacity-70 text-2xl cursor-pointer z-10;
+  @apply absolute left-5 top-1/2 w-7 h-11 bg-gray-300 flex justify-center items-center opacity-70 text-2xl cursor-pointer z-10;
 }
 
 #rightArrow {
-	//left: auto;
+  //left: auto;
-	//right: 5px;
+  //right: 5px;
-	@apply left-auto right-5;
+  @apply left-auto right-5;
 }
 
 #sliderBtn {
-	//position: absolute;
+  //position: absolute;
-	//width: 100%;
+  //width: 100%;
-	//bottom: 0;
+  //bottom: 0;
-	//display: flex;
+  //display: flex;
-	//justify-content: flex-end;
+  //justify-content: flex-end;
-	//z-index: 1000;
+  //z-index: 1000;
-	@apply absolute w-full bottom-0 flex justify-end z-10;
+  @apply absolute w-full bottom-0 flex justify-end z-10;
 }
 
 .unitBtn {
-	//width: 10px;
+  //width: 10px;
-	//height: 10px;
+  //height: 10px;
-	//background-color: #eee;
+  //background-color: #eee;
-	//border-radius: 10px;
+  //border-radius: 10px;
-	//margin: 10px;
+  //margin: 10px;
-	//cursor: pointer;
+  //cursor: pointer;
-	@apply w-4 h-4 bg-gray-300 rounded-full m-2 cursor-pointer;
+  @apply w-4 h-4 bg-gray-300 rounded-full m-2 cursor-pointer;
 }
 
 .btnActive {
-	background-color: #4C98F7;
+  background-color: #4C98F7;
 }