定位

=================================================================================

用了子絕父相而帶來(lái)的子盒子居中問(wèn)題的解決辦法。(因?yàn)橛貌涣薽argin:o auto)

標(biāo)簽包含規(guī)范

◆div可以包含所有的標(biāo)簽。
◆p標(biāo)簽不能包含div h1等標(biāo)簽。
◆h1可以包含p，div等標(biāo)簽。
◆行內(nèi)元素盡量包含行內(nèi)元素，行內(nèi)元素不要包含塊元素

規(guī)避脫標(biāo)流

◆盡量使用標(biāo)準(zhǔn)流。
◆標(biāo)準(zhǔn)流解決不了的使用浮動(dòng)。
◆浮動(dòng)解決不了的使用定位。

圖片和文字垂直居中對(duì)齊

vertical-align對(duì)inline-block最敏感。默認(rèn)屬性是:vertical-align:baseline;

８ css之內(nèi)容移除（網(wǎng)頁(yè)優(yōu)化 :既然搜索引擎SEO 能搜索到關(guān)鍵字）

◆使用text-indent:-5000em;
注意一定要變成行內(nèi)塊:不然 行內(nèi)元素的寬高和內(nèi)容一樣，實(shí)現(xiàn)不了挪動(dòng)

◆將元素高度設(shè)置為0,使用內(nèi)邊距將盒子撐開(kāi)，給盒子使用overflow:hidden;將文字隱藏。

Css精靈圖

就是很多小圖都集中到了一張大圖片上，想要取什么就 ,就設(shè)置一下div 的width 和height 和要取得這張小圖同樣寬高。 再利用background:url(" ") 0 -30px ； 實(shí)現(xiàn)取圖

額外內(nèi)容

emmet是在sublime中的一個(gè)插件在這個(gè)插件中集成很多的快捷鍵

１２ html: １２.1 生成結(jié)構(gòu)的快捷鍵： ！+ tab,可以生成html5的結(jié)構(gòu)代碼。 １２.2 生成id名和類名 標(biāo)簽名.類名#id名+tab 沒(méi)有標(biāo)簽名.類名+tab ==>div １２.3 生成同級(jí)元素： 標(biāo)簽名+標(biāo)簽名+標(biāo)簽名 “+”tab １２.4 生成子類標(biāo)簽 標(biāo)簽名>子標(biāo)簽名>子標(biāo)簽名>子標(biāo)簽名+tab 標(biāo)簽名>子標(biāo)簽名>子標(biāo)簽名>子標(biāo)簽名^^子標(biāo)簽名+tab １２.5 帶固定數(shù)量的標(biāo)簽:ul>li*5+tab １２.6 帶有序號(hào)名稱 ul>li.abc$*3 + tab １２.7 生成帶有內(nèi)容的標(biāo)簽： ul>li>a{item}*5１３ csswidth:30px==>w30+tabHeight:30px==>h30+tabMargin:30px==>mg30+tab Padding:30px==> pd30+tab Line-height:12px==>lh12px+tab Background==>bg+tab

轉(zhuǎn)載于:https://www.cnblogs.com/czy16/p/8299160.html

總結(jié)

以上是生活随笔為你收集整理的第6天-css笔记 三大定位-定位 子绝父相 与精灵图的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。