【嘉興東臣php】HTML+CSS+JS周總結

         這一週咱們學習了XHTML、CSS、JS三大塊內容,從簡到難的學習過程,XHTML讓我學到了各類各樣的標籤等等,css定義了標籤元素的樣式,js實現了彈窗、函數調用的效果。css

        差很少這一週一直在作登錄註冊的頁面,我以爲我對於css的內容還不是特別熟練,各類對於樣式的調試,div的運用仍是初出茅廬,js的話還能夠,流程控制方面和c語言有些類似之處,因此掌握得還行。
函數

1、XHTML

 一、XHTML 就是XML和HTML的結合體,X表明可擴展的。簡單的說XHTML就是嚴謹規範化的HTML語言。
學習


二、XML,XML實際上是一種標記性的語言。例如:
<break></break>,<hello><rose></rose></hello>

三、XHTML 有如下幾個特性:
    一、有頭就有尾,用<>表示出來。
    二、層次化的東西,必定要正確,不要顛倒。
    三、全部的屬性和元素都要小寫。
    四、空元素,也要有結束標籤 例如<br/><hr/>
    五、多用ID,少用Name

四、dl dd dt 都是定義一個自定義列表的,參考之前學過的ul li,例如:
        <dl>
           <dt>你好</dt>
           <dd>這是向你問好</dd>
           <dt>你很好</dt>
           <dd>這是說你人很好</dd>
        </dl>

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



2、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 縱軸平鋪網站

1五、background-attachment:隨背景圖片滾動,fixed不滾動,scroll滾動,通常設置爲fixed

1六、position:relative 相對定位,距離最近的元素標籤的距離
    position:absolute 絕對定位,距離body的距離url



3、JS

一、background-color:rgba(0,0,0,0.5); 設置DIV透明度

二、JS,JS是基於Web的網頁端的腳本語言。
   HTML是名詞 ,CSS 是形容詞,JS 是動詞。

三、function 函數名(){ } 定義一個函數,函數名() 調用了一個函數

四、alert(「內容」); 警告框。

五、document.write("內容");寫入一個內容,能夠加入HTML代碼

六、confirm(「內容」); 是確認框

七、window.close 關閉窗口 IE

八、關鍵字:又叫保留字,特指語言中內部所使用單詞,這些單詞禁止用來作 變量、常量或者函數的名字。

九、標識符:是告訴你 變量、常量或者函數的名字只能 字母、下劃線、$符號開頭。

十、轉義符:能夠常常用\ 轉義某一個特殊符號 如" 能讓腳本正常運行。

十一、變量:能夠改變的量,如數值、字符串、浮點、布爾
    變量用var申明。例如var a = 10;這就是告訴你,一個名字叫a的變量賦了一個初始值爲10;注意10爲整型。

十二、常量:不能改變的量,常量用const申明,例如:const b = 10;這就是告訴你,一個名字叫b的常量值爲10,而且這個值不能改變,除非你銷燬它。

1三、document.writeln("<pre>") 支持轉義字符,如\n換行等,注意:必須在<pre> </pre> 之間寫轉義。

1四、undenfied 是指找不到某一個對象的屬性或者某一個變量,沒有賦初始值,如:var abc;  alert( document.alert );

1五、null 是指空置,特指找到了屬性,可是找不到或者獲取不到值。因此爲空。

1六、全局變量和局部變量,通常發生在做用域以內,全局變量通常是在函數的以外,局部的是在函數的裏面的。全局變量能夠做用於多個函數,可是局部只能做用於本身的函數裏,不能去管別人。

1七、+ 在一般的狀況下是表示字符串的鏈接符,例如:"a"+"b" 輸出的就是ab,

1八、+ 在字符串和任何的類型都是鏈接符。

1九、+ 在整型之間的是作加法運算符。

20、其餘的 - * / 都是運算符,可是注意:若是強制讓一個字符串運算的話,結果是NaN,就是特指未知的值。

2一、parseInt() 將其餘類型轉化爲整型,注意轉化整型是從左往右,取出所有的整型,當遇到第一個非整型的值時結束。如:「101a1」 取出的是 101

2一、parseFloat() 將其餘類型轉化爲浮點型。

2二、運算符分類
        一、算術運算符:+ - * /
        二、比較運算符:> < == >= <=
        三、賦值運算符:a = b
        四、邏輯運算符:&&(同時知足),||(或,知足一個),!(非,取反值)。
        五、條件運算符:條件 ?條件成立 : 條件不成立

        一、注意:比較運算符返回,布爾類型也就是true或者false。
        二、注意:&&(與)運算符,若是兩個數比較的話,返回後者,注意:同時知足纔會知足。
        三、注意:或運算符,若是兩個數比較的話,或運算符的特色就是知足一個就是知足,後面的至關於不須要看,因此只要前面知足,返回就是前面後面。

2三、條件判斷
        一、第一種形式
        if(條件){
        
        }else{
        
        }

        二、第二種形式
        if(條件){
    
        }else if(條件){

        }else{

        }

        三、第三種形式
        if(條件){
            if(條件){

            }else{

            }        
        }else{

        }   
spa

相關文章
相關標籤/搜索