close
文章出處 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標題文檔</title>
<style type="text/css">
#a1{ width:100px; height:30px; background-color:#60C; color:#FFF; text-decoration:none}

#d1{ width:300px; height:300px; background-color:#F3C; text-align:center ; vertical-align:auto; line-height:200px}

#an{ width:104px; height:40px; background-color:#38F; font-size:16px; text-align:center; vertical-align:middle; line-height:40px;}
#wai{ width:300px; height:300px; background-color:#0F0}
#nei{ float:left; width:300px; height:300px; margin:20px 30px 20px 30px; padding:40px 0px 0px 10px}
#li{ width:100px; height:200px; background-color:#C09}


*{ margin:opx auto; padding:opx;}
</style>

</head>

<body>
<div style="alignment-baseline:after-edge">hello</div>
<div style=" font-family:Verdana, Geneva, sans-serif; font-size:36px; font-weight:bold; font-style:italic; color:#000; text-decoration:blink;background-size:600px 600px; background-position:bottom; background-repeat:no-repeat; background-image:url(2016-05-27_plaque_hp.jpg); width:600px;height:600px; background-color:#F00";  >測試文字</div>  <br/>
<a id="a1" href="http://www.baidu.com">超鏈接</a>
<div id="d1">幸福呀好</div>
<div id="an">百度一下</div>
<p style="text-indent:31px; text-height:50px">感第二方提供優惠讓他與偶乳房同歸于盡讓退團購會回家覺就回家巨坑u句回家回家回家好回家好看好看巨坑好看回家考慮好看即將巨坑看巨坑就你嗎， 不能那么， 巨坑就， </p>
<div id="wai">
    <div id="nei">
    <div id="li">
    </div>
    </div>


</div>



</body>
</html>

樣式控制大小，寫樣式屬性時，后面要寫單位像素px，高度和寬度要用分號;區分
背景圖片可以用五個來調整，分別為bottom下邊，lift左邊，center居中，right右邊，top上邊

repeat-x是平鋪的意思

background-size：      是修改背景圖大小

控制字體

網絡最常見的字體是微軟雅黑，常用的字體大小是14px或16px

font-weigh:bold是字體加粗

font-style:italic是字體傾斜

直接寫color：       是代表字體顏色

text-decoration：可以選上劃線，下劃線，還有刪除線，代表文本修飾

超鏈接，讓超鏈接變成正常文字的外形

給它做一個內嵌，加入樣式屬性，text-decortaion:none 加入這個，可以打掉超鏈接的下劃線

還學到好幾個屬性

text-align：ceter   是文字水平對齊方式，ceter是居中

vertical-align垂直對齊方式  line-height:       在行高里面居中，這兩個可以配合使用

設置樣式

在寫段落時<p>內容</p>

可以在p后面增加樣式  style="text-indent:30px"    是縮進多少像素的意思

邊界邊框

邊距是margin:      內邊距是padding

設置邊距的時候，比如說margin:20px 30px 20px 30px   這是按順時針的方向來的，上右下左

*{margin:opx auto;padding:opx}這句話在做網頁的時候都能用到，是把所有元素內邊距和外邊距都去掉

 


不含病毒。www.avast.com
arrow
arrow
    全站熱搜

    AutoPoster 發表在 痞客邦 留言(0) 人氣()

    E-mail轉寄