靜態頁面布局總結（新手）

MasonEast 發布于2019-08-02 12:11 / 2439人閱讀

摘要：學習一個月了，對和頁面的靜態布局進行一次總結總體來說靜態頁面布局分為兩大類，水平布局和垂直布局，只要水平布局和垂直布局都能熟悉了，那么對于靜態的頁面的布局就不會有太大的問題再說布局之前先說一下元素的顯示模式分類。

學習HTML一個月了，對HTML和Css頁面的靜態布局進行一次總結

總體來說靜態頁面布局分為兩大類，水平布局和垂直布局，只要水平布局和垂直布局都能熟悉了，
那么對于靜態的頁面的布局就不會有太大的問題
再說布局之前先說一下元素的顯示模式分類。
    元素的顯示模式分類可以分為塊級元素，行內元素，行內塊級元素。
    塊級元素是垂直排列的，每個元素會獨占一行，行內元素和行內塊級元素不會獨占一行，會水平排列。
    當然元素的顯示模式是可以隨便轉換的。
下面先來說說垂直布局，
    垂直布局讓元素在頁面里面垂直排列，這個是比較簡單的，我們知道在正常情況下頁面里的
    塊級元素都是從上到下依次排列的，那么這個垂直布局就相對來說簡單點。只要把塊級元素依次寫在頁面中，
    那么瀏覽器會默認的讓這些塊級元素垂直排列，如果有行內塊級元素或行內元素
    則可以轉化為塊級元素來實現元素的垂直排列。
然后是來說水平布局，
    水平布局就是讓元素在頁面里面水平排列，這個比較垂直排列會相對復雜一些，因為水平排列會涉及到浮動，
    因此會出現很多問題，比如高度塌陷，覆蓋等。而且一般都是通過浮動來實現水平布局，所以會遇到很多問題，
    這就要求我們對浮動有一定的了解，下面我會寫一些布局的細節以及浮動的各種情況。
    首先最常用的就是居中顯示，各種居中方式中我們最常用的就是text-align：center ， 
    text-align：center可以讓下面幾種情況居中：
       可以讓該元素的文本內容水平居中，該元素中的行內元素和行內塊級元素，
       但是不能讓元素內部的塊級元素水平居中
       垂直居中，用的最多的是讓line-height=元素的height，還有vertical-align，
       也是垂直對齊，他一般是讓圖片右邊的文本對齊圖片的上中下。
    然后用的多的就是內外邊距了，就是margin和padding，很好的理解和運用內外邊距能夠
    讓你很方便的實現開頭或結尾的一些距離等。
     然后就是定位了，頁面布局的定位最常用的就是浮動（float）和定位（position），
     感興趣的可以去我的日記了有詳細的介紹。
     本人學習前段一個月，完全的菜鳥，希望大家多多指點。

GPU云服務器云服務器頁面布局 html頁面布局 aspx頁面布局 php開發頁面布局

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/53400.html

靜態頁面布局總結（新手）

摘要：學習一個月了，對和頁面的靜態布局進行一次總結總體來說靜態頁面布局分為兩大類，水平布局和垂直布局，只要水平布局和垂直布局都能熟悉了，那么對于靜態的頁面的布局就不會有太大的問題再說布局之前先說一下元素的顯示模式分類。學習HTML一個月了，對HTML和Css頁面的靜態布局進行一次總結總體來說靜態頁面布局分為兩大類，水平布局和垂直布局，只要水平布局和垂直布局都能熟悉了，那么對于靜態的頁面...

sushi 2019-08-29 17:30 評論0 收藏0
移動端布局與適配

摘要：實戰之微信錢包騰訊服務界面網格布局是讓開發人員設計一個網格并將內容放在這些網格內。對于移動端適配，不同的公司不同的團隊有不同的解決方案。柵格系統用于處理頁面多終端適配的問題。 grid實戰之微信錢包騰訊服務界面 CSS3網格布局是讓開發人員設計一個網格并將內容放在這些網格內。而不是使用浮動制作一個網格，實際上是你將一個元素聲明為一個網格容器，并把元素內容置于網格中。移動端頁面適配—...

Clect 2019-08-29 14:08 評論0 收藏0
分享一些遇到的好文章

摘要：移動端布局總結移動端全兼容的移動端知識涵蓋偽類等全移動端不得不講的頭標簽移動端自適應方案移動端適配總結布局新舊混合寫法詳解兼容微信使用實現手淘頁面的終端適配淘寶彈性布局方案實踐理解所需的知識產生的小數像素問題高性能動畫動畫的性能優化處理和動移動端rem布局總結移動端全兼容的flexbox 移動端知識(涵蓋、css、偽類等)【全】移動端不得不講的頭標簽移動端自適應方案移動端適...

Tikitoo 2019-08-20 14:49 評論0 收藏0
設計架構

摘要：先來看一張系統前后端架構模型圖。一種接口的約定本文用于定義一種統一的接口設計方案，希望具有參考價值。，和都是常見的軟件架構設計模式，它通過分離關注點來改進代碼的組織方式。如何無痛降低 if else 面條代碼復雜度相信不少同學在維護老項目時，都遇到過在深深的 if else 之間糾纏的業務邏輯。面對這樣的一團亂麻，簡單粗暴地繼續增量修改常常只會讓復雜度越來越高，可讀性越來越差，有沒...

graf 2019-06-24 17:56 評論0 收藏0