【嘉興東臣php】HTML+CSS+JS基礎學習周總結

   第一週學習了XML CSS JS三大塊的內容,本身對於這三大塊的內容一開始只是模模糊糊的感受,基本寫不出一個像樣的註冊登陸頁面來.一個多星期的學習讓我以爲本身把零散的知識整合到一塊兒。知道了XML就是標準化的HTML,HTML就是一個框架結構,而CSS就是表現形式,JS就是行爲,三者合起來組成了一個很是炫酷的網頁。框架

     第 二天老黃教了盒子模型。盒子模型最重要的三個元素:外邊距+內邊距+邊框。其餘包括定位,邊框設置透明度(opacity:0.2)設置,層的設置(z- index:-1),清除內邊距、清除外邊距 例如 body{margin:0px;padding 0px;}(基本上都是工做上的網站用法).函數

     第三天學習了CSS部分的內容,絕對定位和相對定位是個很糾結的問題,不過糾結了一天終於中晚上搞定了。屬性background-attachment:隨背景圖片滾動,fixed不滾動,scroll滾動,通常設置爲fixed。學習

     第 四天學習了JS,JS是服務端不須要進行編譯的腳本語言。學習了幾種彈框的函數。null ,undefined ,NaN   一、獲取不到這個相關屬性值,好比找不到選擇器裏的值得時候。就會有null也就是空值。2.Undefined獲取不到這個屬性的時候,或者一個相關的 變量沒有賦初始值就輸出的時候。因此就會有Undefined的狀況出現。三、NaN一般爲在作運算符操做的時候,沒法確認數值的時候(好比字符串和整形 相乘時),爲NaN, 注意:+ 在操做字符串的是起的是連接的做用。字體

   第五天教的新內容很少,基本教的之前掌握了差很少,一天講最多的就是流程控制,這種東西很容易把人繞進去,因此我以爲學這塊適合本身看書慢慢領悟,這樣效率更高。網站

一.XHTML

一、XHTML 就是XML和HTML的結合體,X表明可擴展的。簡單的說XHTML就是嚴謹規範化的HTML語言。
二、XML,XML實際上是一種標記性的語言。例如:
<break></break>,<hello><rose></rose></hello>
三、XHTML 有如下幾個特性:
    一、有頭就有尾,用<>表示出來。
    二、層次化的東西,必定要正確,不要顛倒。
    三、全部的屬性和元素都要小寫。
    四、空元素,也要有結束標籤 例如<br/><hr/>
    五、多用ID,少用Name
四、visibility: hidden; 設置元素不可見
五、background-repeat:no-repeat  背景不重複
六、整理一個登陸頁面完成的步驟(參照renren.com):
    一、定義列表 <dl><dd></dd></dl>
    二、在列表的相關的項裏面加入input 文本框
    三、設置文本框的樣式,height,width,padding,margin,font-size等
    四、設置dd的樣式
    width,height等。注意設置了dd樣式必定也要算好input文本框的樣式,由於dd裏面嵌套了至少一個input
    五、接下來
url

的是按鈕,按鈕只須要遵照dd的基本樣式,而且設置好背景顏色便可。
    六、驗證碼:注意驗證碼的dd列表,有兩部分組成:文本框和驗證碼圖片,注意分配寬度,另外,要想兩個控制在一行,請設置驗證碼圖片 float:right;另外須要注意:文本框不能太寬,可能會把驗證碼擠掉,最重要一點必定要限制dd的寬度,否則會在屏幕的最右邊去了。
    七、邊框,border,注意:設置相關的width和高度,另外最好設置一個背景圖片或者顏色,最好設置一個內邊距padding,由於邊框和控件最好有距離。
    八、設置這個邊框,float:right
    九、設置body的背景圖片:background-image:(url:圖片連接)。
spa

二.CSS(盒子模型)

一、盒子模型
     盒子模型顧名思義就是像盒子,它包括,外邊距(margin),內邊距(padding),邊框(border),詳細請參加firebug中的盒子模型的圖例。
二、clear:both  清除浮動,因爲float浮動會形成全部的元素都會在一行,所以清除的話可能會達到換行的效果。
三、opacity: 0.2(表示20%的透明度); 透明度,通常設置在層裏。
四、z-index: 數字。數字越大,顯示在越上層,能夠表示負數。
五、border-top-style: 上邊框的樣式
     border-top-width: 上邊距的粗細
     border-top-color: 上邊框的顏色
     border-top: 上邊框
六、border: 10px inset red; 綜合設置,相關的樣式 邊框粗細,樣式,顏色,注意只能綜合設置,不能設置單一。
七、boder-style: dashed 虛線 dotted 點線
solid 實線 none 不顯示
八、background-position: 2px 0px; 圖片定位,注意兩個參數表示爲 x 和 y。注意設置這個塊元素的寬和高。
九、font: 36px 微軟雅黑; 設置字體的複合屬性,大小和字體
十、負數之美:margin 是可使用負數,也就是相反的反向,padding 不可使用負數。
十一、清除內邊距、清除外邊距 例如 body{
     margin:0px;padding 0px;
}  (基本上都是工做上的網站用法)
十二、overflow: hidden; 當界面溢出以後的效果,hidden爲隱藏,還有一種經常使用就是scroll
1三、margin: 0 auto 水平居中,可是要注意:由於設置的是外邊距,所以最好是設置div裏面的塊元素。
1四、background-repeat:背景是否平鋪。repeat 平鋪,no-repeat 不平鋪,repeat-x 橫軸平鋪,repeat-y 縱軸平鋪

圖片

三:JS

學習JS,瞭解基本的JS語言。包括函數的定義,確認框和彈出框等等。原本對運算符的返回值有些懵懂,如今學過以後已經能夠領悟。
今天還學了全局和局部變量的做用域。變量的定義以及常量。感受回到大一學C的狀態。可是JS和C有些語法又不太同樣,容易混淆,因此還得慎重對待學習,不能大意。ci

腳本語言:省略編譯等過程的語言好比JS。作用域

var 只是定義變量,不定義類型,由編譯器定義類型
比較運算符比較時會盡可能轉化成接近的類型進行運算

null ,undefined ,NaN
           一、獲取不到這個相關屬性值,好比找不到選擇器裏的值得時候。就會有null也就是空值。
           二、獲取不到這個屬性的時候,或者一個相關的變量沒有賦初始值就輸出的時候。因此就會有Undefined的狀況出現。
           三、NaN一般爲在作運算符操做的時候,沒法確認數值的時候,爲NaN, 注意:+ 在操做字符串的是起的是連接的做用。

若是強制讓一個字符串運算的話,結果是NaN,就是特指未知的值。parseInt() 將其餘類型轉化爲整型,注意轉化整型是從左往右,取出所有的整型,當遇到第一個非整型的值時結束。如:「101a1」 取出的是 101

相關文章
相關標籤/搜索