作為網(wǎng)頁(yè)設(shè)計(jì)師就知道CSS是基礎(chǔ)，對(duì)CSS的了解能夠設(shè)置更美的網(wǎng)頁(yè)，而在這領(lǐng)域里面有更深的，也讓人著迷的。為了讓您的網(wǎng)站在php虛擬主機(jī)上呈現(xiàn)更加美觀的狀態(tài)，無(wú)憂主機(jī)小編分享10個(gè)小技巧給一些自學(xué)的站長(zhǎng)們，僅供參考。 1. @font-face 可以在服務(wù)器找到需要的字體也在樣式中引入所需要的字體

@font-face {
font-family: Blackout;
src: url("assests/blackout.ttf") format("truetype");
}

2. .clearfix 清除元素浮動(dòng)，可對(duì)任何Html元素單獨(dú)使用

.clearfix:after {
content: ".";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
}

3. @media 設(shè)置當(dāng)前響應(yīng)網(wǎng)站的媒介，可根據(jù)用戶的顯示器調(diào)整網(wǎng)站的寬度

@media screen and (max-width: 960px) {
}

4. transform: rotate(30deg); 結(jié)合轉(zhuǎn)換屬性和CSS轉(zhuǎn)場(chǎng)效果制作很好的動(dòng)態(tài)效果

.title {
transform: rotate(40deg);
}

5. background-size ：在網(wǎng)站中適應(yīng)全屏幕背景

body {
background: url(image.jpg) no-repeat;
background-size: 100%;
}

6. input[type="text"] 使用屬性選擇器來(lái)控制輸入元素的提交版本或?yàn)橐粋€(gè)外鏈增加一個(gè)圖標(biāo)

input[type="text"] {
width: 250px;
}

7. margin: 0 auto; 使塊級(jí)元素在父元素中居中

#container {
margin: 0 auto;
}

8. a {outline: none;} 聲明將移除點(diǎn)一個(gè)鏈接的虛線框，為了易用性記得給鏈接也加上：focus狀態(tài)。 9. overflow: hidden 清除還沒加載到CSS里面的元素浮動(dòng)的方法，從而提高網(wǎng)站響應(yīng)速度

.container {
overflow: hidden;
}

10. color: rgba(); 設(shè)置不通顏色通道透明值，去實(shí)現(xiàn)透明性，比如：0.5對(duì)應(yīng)的是50%透明度

.btn {
color: rgba(0,0,0,0.5);
}

如果您是自助建站，那么這些CSS技巧如果您能學(xué)學(xué)，對(duì)您的網(wǎng)站美化是有一定幫助的。

無(wú)憂主機(jī)相關(guān)文章推薦閱讀：

怎么判斷SQL文件是否備份完全

如何選擇建站程序？

本文地址：http://m.love62.cn/others/18559.html

上一篇: 如何設(shè)置FileZilla工具顯示出隱藏文件
下一篇: 如何解決Destoon后臺(tái)登陸出現(xiàn)license.txt不可修改或刪除提示