亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定

HTML5和CSS3扁平化風格博客

表嚴肅 Web前端工程師
難度中級
時長 1小時51分
學習人數
綜合評分9.57
257人評價 查看評價
9.8 內容實用
9.6 簡潔易懂
9.3 邏輯清晰
  • reset.css重置樣式,去除所有的樣式包括標題的字體大小 normalize.css常規化樣式,在默認的HTML元素樣式上提供了跨瀏覽器的高度一致性。相比于傳統的CSS reset,Normalize.css是一種現代的、為HTML5準備的優質替代方案
    查看全部
  • 模塊分析!
    查看全部
  • "ctrl"+"shift"+"[" 收縮代碼, "ctrl"+"shift"+"]" 展開代碼, "ctrl"+"e" 快速生成一個div.
    查看全部
  • 奇偶選擇器函數 所有奇數::nth-child(odd){} 所有偶數: nth-child(even){}
    查看全部
  • 問題:中間有縫隙 解決:padding=0 marjin=0 font-size重置為0(總的div中) 字體大小不同,行高不同
    查看全部
  • 子元素浮動,pre>div{ float:left} 父元素 pre:after{ context:'';display;block;clear;both;} display 屬性規定元素應該生成的框的類型 block :塊對象的默認值。用該值為對象之后添加新行 :after 選擇器向選定的元素之后插入內容。 使用content 屬性來指定要插入的內容。
    查看全部
  • normalize css常規化 reset css重置
    查看全部
  • #banner.inner沒有居中作用,改成.inner就可以了 #banner.inner h1沒有消除h1的邊距,改成.inner h1就可以了
    查看全部
  • https://necolas.github.io/normalize.css/7.0.0/normalize.css
    查看全部
  • <section> 標簽 定義文檔中的節(section、區段)。比如章節、頁眉、頁腳或文檔中的其他部分。 <section> 標簽是 HTML 5 中的新標簽。 <nav> 標簽定義導航鏈接的部分。 HTML 4.01 與 HTML 5 之間的差異 <nav> 標簽是 HTML 5 中的新標簽。 提示和注釋 提示:如果文檔中有“前后”按鈕,則應該把它放到 <nav> 元素中。 HTML5中的新元素標簽<nav>用來將具有導航性質的鏈接劃分在一起,使代碼結構在語義化方面更加準確,同時對于屏幕閱讀器等設備的支持也更好。 一直以來,我們習慣于使用形如<div id="nav">或<ul id="nav">這樣的代碼來寫頁面的導航;在HTML5中,我們可以直接將導航鏈接列表放到<nav>標簽中 nav元素是一個可以用來作為頁面導航的鏈接組;其中的導航元素鏈接到其他頁面或當前頁面的其他部分。并不是所有的鏈接組都要被放進<nav>元素;例如,在頁腳中通常會有一組鏈接,包括服務條款、首頁、版權聲明等;這時使用<footer>元素是最恰當的,而不需要<nav>元素。 一個頁面中可以擁有多個<nav>元素,作為頁面整體或不同部分的導航;
    查看全部
  • 首先大體,進行模塊分析
    查看全部
  • 重置樣式
    查看全部
  • 對于inline,non-replaced elements, 行內元素無法設置寬高,也無法設置margin,padding. 其中對于行內元素又分成了2類討論: 若top/bottom/margin-top/margin-bottom的計算值為auto,則按0計算. width和height屬性不起作用(doesn't apply),此時盒子的高度取決于line-height. (而不是所有的內聯元素width都不起作用) 塊狀元素可以嵌套塊狀元素,也可以嵌套行間元素 行間元素不可以嵌套塊狀元素,只能嵌套行間元素 display:block block元素會獨占一行,多個block元素會各自新起一行。默認情況下,block元素寬度自動填滿其父元素寬度。 block元素可以設置width,height屬性。塊級元素即使設置了寬度,仍然是獨占一行。 block元素可以設置margin和padding屬性。 display:inline inline元素不會獨占一行,多個相鄰的行內元素會排列在同一行里,直到一行排列不下,才會新換一行,其寬度隨元素的內容而變化。 inline元素設置width,height屬性無效。 inline元素的margin和padding屬性,水平方向的padding-left, padding-right, margin-left, margin-right都產生邊距效果;但豎直方向的padding-top, padding-bottom, margin-top, margin-bottom不會產生邊距效果。 display:inline-block 簡單來說就是將對象呈現為inline對象,但是對象的內容作為block對象呈現。之后的內聯對象會被排列在同一行內。比如我們可以給一個link(a元素)inline-block屬性值,使其既具有block的寬度高度特性又具有inline的同行特性。
    查看全部
  • 字體大小不同,導致行高不同,圖片中間產生間隙,設置font-size:0;
    查看全部
  • 頁面布局
    查看全部

舉報

0/150
提交
取消
課程須知
1.您要具備HTML常用標簽的基礎知識。 2.您要具備CSS的語法。 3.您要具備基本布局知識。
老師告訴你能學到什么?
1、CSS的常規布局方法 2、CSS扁平化風格布局方法 3、網頁布局特殊情況處理方式 4、HTML5相關標簽和CSS3效果。

微信掃碼,參與3人拼團

微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號

友情提示:

您好,此課程屬于遷移課程,您已購買該課程,無需重復購買,感謝您對慕課網的支持!