html + CSS學(xué)習(xí)筆記 5. position關(guān)鍵字 + 6. div 關(guān)鍵字

有的時(shí)候我們就想把某張圖片放在一個(gè)位置上死宣,能改變位置的有margin絮重、padding痕檬、text-align霎槐、float。但是這些太麻煩了梦谜,而且用了margin或者padding后它自己就要占據(jù)好大的地方丘跌,這時(shí)候我們就要用到position了。

實(shí)例:

<img src="http://i03.pic.sogou.com/7e35a5be5ef96ed5" style="position: absolute; top: 100px; left:100px">

position: absolute 這句代碼的意思是給圖片設(shè)置為絕對(duì)定位唁桩。后面的top:100px;和left:200px;的作用就是我想讓它放在距離上邊100像素距離左邊200像素的地方闭树。當(dāng)然也可以使用right和bottom來設(shè)置你想要的位置。

div:可定義文檔中的分區(qū)或節(jié)荒澡”ㄈ瑁可以把文檔分割為獨(dú)立的、不同的部分单山。簡單說法:就比如我們?yōu)g覽新聞網(wǎng)站的時(shí)候碍现,它上面有政治新聞幅疼、娛樂新聞、體育新聞等昼接。它們都屬于不同的類型爽篷。所以程序員制作網(wǎng)頁的時(shí)候都是把它們分成幾大部分。那么<div>呢慢睡,就是用來給網(wǎng)頁分塊布局的逐工。

實(shí)例:

<div style='border:solid 1px; position: absolute; top: 1px; left: 20px '>

<h3> this is a header.</h3>

<p>this is a paragraph.</p>

</div>

現(xiàn)在<h3>和<p>元素的父元素就從原來的整個(gè)瀏覽器變成<div>了。這就是<div>的作用漂辐,現(xiàn)在它就把它里面的內(nèi)容就分成了網(wǎng)頁中的一部分泪喊。




















呢,就是用來給網(wǎng)頁分塊布局的者吁。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末窘俺,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子复凳,更是在濱河造成了極大的恐慌瘤泪,老刑警劉巖,帶你破解...
    沈念sama閱讀 210,914評(píng)論 6 490
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件育八,死亡現(xiàn)場離奇詭異对途,居然都是意外死亡,警方通過查閱死者的電腦和手機(jī)髓棋,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 89,935評(píng)論 2 383
  • 文/潘曉璐 我一進(jìn)店門实檀,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人按声,你說我怎么就攤上這事膳犹。” “怎么了签则?”我有些...
    開封第一講書人閱讀 156,531評(píng)論 0 345
  • 文/不壞的土叔 我叫張陵须床,是天一觀的道長。 經(jīng)常有香客問我渐裂,道長豺旬,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 56,309評(píng)論 1 282
  • 正文 為了忘掉前任柒凉,我火速辦了婚禮族阅,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘膝捞。我一直安慰自己坦刀,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 65,381評(píng)論 5 384
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著鲤遥,像睡著了一般央渣。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上渴频,一...
    開封第一講書人閱讀 49,730評(píng)論 1 289
  • 那天,我揣著相機(jī)與錄音北启,去河邊找鬼卜朗。 笑死,一個(gè)胖子當(dāng)著我的面吹牛咕村,可吹牛的內(nèi)容都是我干的场钉。 我是一名探鬼主播,決...
    沈念sama閱讀 38,882評(píng)論 3 404
  • 文/蒼蘭香墨 我猛地睜開眼懈涛,長吁一口氣:“原來是場噩夢啊……” “哼逛万!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起批钠,我...
    開封第一講書人閱讀 37,643評(píng)論 0 266
  • 序言:老撾萬榮一對(duì)情侶失蹤宇植,失蹤者是張志新(化名)和其女友劉穎,沒想到半個(gè)月后埋心,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體指郁,經(jīng)...
    沈念sama閱讀 44,095評(píng)論 1 303
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 36,448評(píng)論 2 325
  • 正文 我和宋清朗相戀三年拷呆,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了闲坎。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 38,566評(píng)論 1 339
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡茬斧,死狀恐怖腰懂,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情项秉,我是刑警寧澤绣溜,帶...
    沈念sama閱讀 34,253評(píng)論 4 328
  • 正文 年R本政府宣布,位于F島的核電站伙狐,受9級(jí)特大地震影響涮毫,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜贷屎,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,829評(píng)論 3 312
  • 文/蒙蒙 一罢防、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧唉侄,春花似錦咒吐、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,715評(píng)論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽候生。三九已至,卻和暖如春绽昼,著一層夾襖步出監(jiān)牢的瞬間唯鸭,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 31,945評(píng)論 1 264
  • 我被黑心中介騙來泰國打工硅确, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留目溉,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 46,248評(píng)論 2 360
  • 正文 我出身青樓菱农,卻偏偏與公主長得像缭付,于是被迫代替她去往敵國和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子循未,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 43,440評(píng)論 2 348

推薦閱讀更多精彩內(nèi)容

  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案陷猫? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標(biāo)簽?zāi)J(rèn)的外補(bǔ)...
    _Yfling閱讀 13,734評(píng)論 1 92
  • 轉(zhuǎn)載請(qǐng)聲明 原文鏈接地址 關(guān)注公眾號(hào)獲取更多資訊 第一部分 HTML 第一章 職業(yè)規(guī)劃和前景 職業(yè)方向規(guī)劃定位...
    程序員poetry閱讀 16,524評(píng)論 32 459
  • 1.CSS基本概念 1.1 CSS的定義 CSS(Cascading Style Sheets)層疊樣式表,主要用...
    寥寥十一閱讀 1,815評(píng)論 0 6
  • 去年通過學(xué)習(xí)把時(shí)間當(dāng)做朋友和通往財(cái)富自由之路的妖,突然明白了原來有學(xué)習(xí)沒成長是因?yàn)闈M足于在頭腦層面上打轉(zhuǎn)绣檬,沒有踐行。懂...
    嘉媽閱讀 179評(píng)論 0 1
  • 2017.07.05 此時(shí)窗外下著小雨羔味,我的案前放著一盤女兒小美的做的鮮切水果河咽,剛剛在小組群分享了與金剛智慧結(jié)緣的...
    花開見佛笑閱讀 335評(píng)論 0 3