1. <rp id="zsypk"></rp>

      2. 網頁設計中的CSS 技術及優化分析論文

        時間:2021-04-21 18:43:40 論文 我要投稿

        網頁設計中的CSS 技術及優化分析論文

          1 CSS 技術特點

        網頁設計中的CSS 技術及優化分析論文

          互聯網剛興起時,網頁缺少動感,布局內容也有許多因素限制,設計起來難度較多。即使專業的HTML 技術人員,在網頁設計中也需要通過不斷測試,才能掌握網頁中的信息排版,在這樣的背景下,樣式表應時而生,CSS技術具有以下特點。對網頁中的元素進行精準定位。網頁設計者在網頁設計中,如同導演,網頁中圖片、文字就是演員,網頁設計人員依據要求使“演員”扮演好自己的角色,操控起來十分簡單。將網頁中的格式控制與網頁中的內容分離。網頁瀏覽者在瀏覽過程中,面對是網站內容結構,為了幫助瀏覽者更好地查看網頁中的信息,在設計中需要合理利用格式控制,將的內容與格局分離,從而對網頁布局進行更加合理的控制,即將CSS 代碼獨立,從另一角度實現對頁面布局和外觀的控制。頁面布局的控制。通過CSS 技術,能夠事項對HTML的有效控制,并且可以在網頁中對圖像的位置進行準確定位。制作體積加載更快。體積更小的網頁,CSS 樣式只是簡單的文本,在設計中不需要執行程序、圖像、插件,在執行上就如同HTML 中的指令一樣快。

          2 CSS 技術在網頁設計中的應用

          2.1 外部樣式表

          外部樣式主要適用網頁中存在多個副面,外部樣式表一文件存儲的情況,通常情況下文件的擴展名為.css。網絡頁面中應用外部樣式,可以將多個網頁與.css 文件進行連接,通過改變一個.css 文件中的內容對整個網站的'布局進行調整。例如m.css 需要將 添加到文檔頭部,將去作為標簽,具體方式代碼如下:

          css”/>

          . . . . . . . . .

          在網頁設計過程中,可以通過外部文件,對編輯中的文本進行編輯,但是在編輯中需要注意,不能出現任何HTML中的代碼,例如:

          p{color: red;font-size:14px;}

          body{background-color:#FFDFFD}

          其中color 為屬性,red 為值;font-size 為屬性,14px 為值;background-color 為屬性,#FFDFFD 為值。

          2.2 內部樣式表

          如果一個在網頁設計中,不需要特殊樣式,通常為簡化,都采用內部樣式,可以將

          p{color:red;font-size:14px;}

          body{background-color:#FFDFFD}

          ??

          內部樣式與外部樣式相比,更加簡單實用,在網站頁面頭部,輸入同一樣式,可使網站中所有頁面都呈現統一的樣式。

          2.3 內聯樣式表

          網頁設計中內連樣式表,可以將style 參數直接加入到HTML中,添加的參數就是CSS 多屬性與值,內嵌的樣式如下:

          設計中,內聯樣式表與其它兩種樣式相比,使用率相對少,主要這種方式不容易在網頁中重復使用,如果上述的p 元素在網頁設計中重復式樣,網頁會將p 元素定義為完全重復,樣式屬性也會出現重復,會加大對網頁的維護和閱讀難度。

          3 優化CSS 代碼

          在網頁設計中,為了使網站能夠快速的顯示出來,Web創建者在實際操作中,需要對網站中的圖像文件進行壓縮。CSS 樣式表是純文本文件,所占內存較小,在設計中不需要進行壓縮,但在應用過程中,也有一些方法可以使其格式縮小20% ~ 50%。

          3.1 縮寫性質

          利用專用性質名取代相關性質集合。例如,paddingtop、padding-left 等性質在CSS 帶面中就可以進行縮寫。在網頁設計中可以通過以下代碼代替復雜的代碼。

          .body{margin:12px 18px 20px 24px;padding:4px 8px

          6px 5px

          Border-top: thin solid #000000;}

          此外,在對縮寫性質進行應用中,屬性之間的間隔通過空白完成。如果屬性之間出現類似值時,要注重連續屬性的順序,屬性由頂部開始,依照順時針順序進行。如果縮寫性質相同,可以簡單羅列單個屬性,將后面的三項屬性縮寫。

          3.2 通過樣式覆蓋簡化代碼

          如下CSS 樣式

          .a,

          .b,

          .c {font- size;10px;padding:10px;width:200px;

          background- color:black }

          .a {border:2px solid red;}

          .b {border:2px solid blue;}

          對以上這段CSS 樣式進行分析,可以發現,三個樣式邊框屬性,除了顏色之外其余并誤差別,因此可以將無差別的屬性進行歸納在一起,對顏色進行單獨控制,優化的樣式如下:

          .a,

          .b,

          .c {font- size;10px;padding:10px;width:200px;

          background- color:black;border:2px solid:red}

          .2 {border:2px solid blue;}

          .3 {border:2px solid black;}

          優化后代碼能夠實現與原代碼一樣的效果,代碼的屬性變得更加簡單。

          3.3 提高代碼重復率

          重復使用代碼是CSS 在網頁設計上的主要優勢,多數網站設計中,對CSS 中的代碼已經進行了重復利用,但受設計者自身影響,并沒有得到合理的重復使用。在CSS 代碼編寫中,應當盡力避免重復的元素屬性值多次編寫。

          4 結 語

          現代網頁設計中對CSS 技術的應用十分廣泛,在應用CSS 技術過程中,不僅需要注意應用的合理性,同時應當通過分析,采取相應的方式,簡化CSS 代碼,使其變得更加合理、簡潔。

        【網頁設計中的CSS 技術及優化分析論文】相關文章:

        網頁設計教學中DIV+CSS布局的運用論文11-11

        網頁設計中色彩的運用分析論文11-19

        總圖運輸設計的技術優化分析論文07-02

        “網頁設計與制作”課程中的應用分析論文11-18

        網頁設計中的色彩搭配分析論文11-19

        網頁設計中的扁平化設計分析論文11-19

        分析美學在網頁設計中的表現手段論文11-13

        中國元素在茶類網頁設計中的應用分析論文11-14

        網頁設計中FLASH的運用論文11-19

        99热这里只有精品国产7_欧美色欲色综合色欲久久_中文字幕无码精品亚洲资源网久久_91热久久免费频精品无码
          1. <rp id="zsypk"></rp>

          2. 在线看片免费不卡人成视频 | 日韩女同性一区二区三区 | 亚洲国产综合精品中文字幕 | 自拍偷在线精品自拍偷99 | 色无月激情五月在线观看 | 日韩专区欧美精品 |

            網頁設計中的CSS 技術及優化分析論文

              1 CSS 技術特點

            網頁設計中的CSS 技術及優化分析論文

              互聯網剛興起時,網頁缺少動感,布局內容也有許多因素限制,設計起來難度較多。即使專業的HTML 技術人員,在網頁設計中也需要通過不斷測試,才能掌握網頁中的信息排版,在這樣的背景下,樣式表應時而生,CSS技術具有以下特點。對網頁中的元素進行精準定位。網頁設計者在網頁設計中,如同導演,網頁中圖片、文字就是演員,網頁設計人員依據要求使“演員”扮演好自己的角色,操控起來十分簡單。將網頁中的格式控制與網頁中的內容分離。網頁瀏覽者在瀏覽過程中,面對是網站內容結構,為了幫助瀏覽者更好地查看網頁中的信息,在設計中需要合理利用格式控制,將的內容與格局分離,從而對網頁布局進行更加合理的控制,即將CSS 代碼獨立,從另一角度實現對頁面布局和外觀的控制。頁面布局的控制。通過CSS 技術,能夠事項對HTML的有效控制,并且可以在網頁中對圖像的位置進行準確定位。制作體積加載更快。體積更小的網頁,CSS 樣式只是簡單的文本,在設計中不需要執行程序、圖像、插件,在執行上就如同HTML 中的指令一樣快。

              2 CSS 技術在網頁設計中的應用

              2.1 外部樣式表

              外部樣式主要適用網頁中存在多個副面,外部樣式表一文件存儲的情況,通常情況下文件的擴展名為.css。網絡頁面中應用外部樣式,可以將多個網頁與.css 文件進行連接,通過改變一個.css 文件中的內容對整個網站的'布局進行調整。例如m.css 需要將 添加到文檔頭部,將去作為標簽,具體方式代碼如下:

              css”/>

              . . . . . . . . .

              在網頁設計過程中,可以通過外部文件,對編輯中的文本進行編輯,但是在編輯中需要注意,不能出現任何HTML中的代碼,例如:

              p{color: red;font-size:14px;}

              body{background-color:#FFDFFD}

              其中color 為屬性,red 為值;font-size 為屬性,14px 為值;background-color 為屬性,#FFDFFD 為值。

              2.2 內部樣式表

              如果一個在網頁設計中,不需要特殊樣式,通常為簡化,都采用內部樣式,可以將

              p{color:red;font-size:14px;}

              body{background-color:#FFDFFD}

              ??

              內部樣式與外部樣式相比,更加簡單實用,在網站頁面頭部,輸入同一樣式,可使網站中所有頁面都呈現統一的樣式。

              2.3 內聯樣式表

              網頁設計中內連樣式表,可以將style 參數直接加入到HTML中,添加的參數就是CSS 多屬性與值,內嵌的樣式如下:

              設計中,內聯樣式表與其它兩種樣式相比,使用率相對少,主要這種方式不容易在網頁中重復使用,如果上述的p 元素在網頁設計中重復式樣,網頁會將p 元素定義為完全重復,樣式屬性也會出現重復,會加大對網頁的維護和閱讀難度。

              3 優化CSS 代碼

              在網頁設計中,為了使網站能夠快速的顯示出來,Web創建者在實際操作中,需要對網站中的圖像文件進行壓縮。CSS 樣式表是純文本文件,所占內存較小,在設計中不需要進行壓縮,但在應用過程中,也有一些方法可以使其格式縮小20% ~ 50%。

              3.1 縮寫性質

              利用專用性質名取代相關性質集合。例如,paddingtop、padding-left 等性質在CSS 帶面中就可以進行縮寫。在網頁設計中可以通過以下代碼代替復雜的代碼。

              .body{margin:12px 18px 20px 24px;padding:4px 8px

              6px 5px

              Border-top: thin solid #000000;}

              此外,在對縮寫性質進行應用中,屬性之間的間隔通過空白完成。如果屬性之間出現類似值時,要注重連續屬性的順序,屬性由頂部開始,依照順時針順序進行。如果縮寫性質相同,可以簡單羅列單個屬性,將后面的三項屬性縮寫。

              3.2 通過樣式覆蓋簡化代碼

              如下CSS 樣式

              .a,

              .b,

              .c {font- size;10px;padding:10px;width:200px;

              background- color:black }

              .a {border:2px solid red;}

              .b {border:2px solid blue;}

              對以上這段CSS 樣式進行分析,可以發現,三個樣式邊框屬性,除了顏色之外其余并誤差別,因此可以將無差別的屬性進行歸納在一起,對顏色進行單獨控制,優化的樣式如下:

              .a,

              .b,

              .c {font- size;10px;padding:10px;width:200px;

              background- color:black;border:2px solid:red}

              .2 {border:2px solid blue;}

              .3 {border:2px solid black;}

              優化后代碼能夠實現與原代碼一樣的效果,代碼的屬性變得更加簡單。

              3.3 提高代碼重復率

              重復使用代碼是CSS 在網頁設計上的主要優勢,多數網站設計中,對CSS 中的代碼已經進行了重復利用,但受設計者自身影響,并沒有得到合理的重復使用。在CSS 代碼編寫中,應當盡力避免重復的元素屬性值多次編寫。

              4 結 語

              現代網頁設計中對CSS 技術的應用十分廣泛,在應用CSS 技術過程中,不僅需要注意應用的合理性,同時應當通過分析,采取相應的方式,簡化CSS 代碼,使其變得更加合理、簡潔。

            【網頁設計中的CSS 技術及優化分析論文】相關文章:

            網頁設計教學中DIV+CSS布局的運用論文11-11

            網頁設計中色彩的運用分析論文11-19

            總圖運輸設計的技術優化分析論文07-02

            “網頁設計與制作”課程中的應用分析論文11-18

            網頁設計中的色彩搭配分析論文11-19

            網頁設計中的扁平化設計分析論文11-19

            分析美學在網頁設計中的表現手段論文11-13

            中國元素在茶類網頁設計中的應用分析論文11-14

            網頁設計中FLASH的運用論文11-19