特效效果https://blog.csdn.net/m0_37809478/article/details/76619207
阿里雲特大優惠活動鏈接：https://promotion.aliyun.com/ntms/yunparter/invite.html?userCode=bsu7swvn
阿里雲雙十二優惠活動：https://m.aliyun.com/act/team1212?params=N.HnyHpvpyAy
前端實用代碼：
text-decoration:none; --超鏈接字體去掉下劃線樣式
border-radius：25px; 屬性用於創建圓角
font-weight:bold; ----字體加粗
box-shadow: 1px 5px 5px #2d2d2f; ---陰影
border-bottom-style:solid ----底邊框爲實線
display: inline-block; ------- 不同模塊在同一行顯示
line-height:52px; ------- 行高設置
text-align: center; ------ 居中
font-family:”微軟雅黑” ---
bootrap -- 柵格佈局 -- offse --- 偏移
boostrap -- push -- pull -- 調換
outline: none; ---- 去除輪廓線
text-decoration:none; ----- 去掉a標籤的下劃線
transition: .36s ease; ----- transition效果需要指定多少秒或毫秒才能完成
-webkit-transform: scale(2, 2);
transform: scale(2, 2);----------- 屬性 放大 縮小 旋轉 2D效果 3D效果等
border-width: 0;-------------------去除input邊框
font-weight: normal; ---------------------設置字體的粗細（normal)去除效果
cursor: pointer; --------------------------- 鼠標變成小手
float:left ----------------------------------兩個div之間沒有間隙使用浮動
position: absolute; --------------------------懸浮-絕對定位---------------------（相對於上級元素的絕對定位）
justify-content:space-between;- ------------------均勻分佈---彈性盒
border: 1px solid transparent; ---------------- //自定義邊框
outline: none; ------------------------------ //消除默認點擊藍色邊框效果
list-style: none; ------------------------------- 消除li 前面的點
overflow: hidden;------------------------------------ 超出的隱藏
text-align: justify; ------------------------------- 文字超過兩行文字的左右對齊
word-break:break-all; ------------------------------- 文字超過兩行後可以恰當的換行
overflow: hidden和white-space: nowrap都是必須的否則不會顯示省略號；
bootbox.setLocale("zh_CN");設置中文樣式
boostrap.box樣式
.modal-dialog{
width: 300px;
position:fixed;
top:40%;
left:40%;
transform:translateX(-50%) translateY(-50%);
}
<!--清除<a>標籤的屬性--->
a:hover, a:visited, a:active{
text-decoration: none;
outline: 0;
}
a{
text-decoration: none;
outline: 0;
}
display: block;
list-style-type:none; ------------清除 標記的類型。 （如：ul前面的點）；
text-align: center; --------------文本居中；
background: url('../image/search_record/logoImg.jpg') no-repeat; ---- --no-repeat:不重複 顯示一張背景圖片
background-size: 100% 100%;- -------------調整 背景的大小
border-radius: 10px; --------------------- radius：半徑 的意思；
line-height:2px ---------------------- 2px(number) 設置數字 計算得出的行高；（normal:默認，設置合理的行間距） 具體參考：http://www.w3school.com.cn/cssref/pr_dim_line-height.asp
text-decoration：none-----------------decoration：裝飾的意思
font: 20px/104px "微軟雅黑";--------------------------（font: bold 40px/50px "微軟雅黑";）font：可以設置所有字體屬性
outline: 0;------------------------------------------- 元素的外邊線
overflow: hidden;------------------------------------- 當元素內的內容 超出時 使用
display: inline;-------------------------------------- inline內聯塊 inline-block:爲行內塊元素（div之間會有間隙） block：解釋：塊
vertical-align: top;---------------------------------- 垂直對齊（top：把元素的頂端與行中最高元素的頂端對齊）
-webkit-border-radius: 5px; ========（-webkit-：兼容chrome 和safari）
-moz-border-radius: 5px; ========（-moz-：兼容火狐）
-ms-border-radius: 5px;
background: -webkit-linear-gradient(left, #ff9916, #ff6600);-------- 漸變色
white-space: nowrap;---------------------------------- 規定段落中的文本不進行換行：
text-overflow: ellipsis;------------------------------ ellipsis：顯示省略號 clip:當對象內文本溢出時不顯示省略標記（...），而是將溢出的部分裁切掉。
position: relative;----------------------------------- 絕對定位 （對象不可層疊，但將依據left，right，top，bottom等屬性在正常文檔流中偏移位置）
box-shadow: darkgrey 0px 0px 27px -3px;--------------- shadow：陰影
transform: translate(-50%,-50%);---------------------- 會有3D/2D 轉換效果 translate 翻轉