第七天:position定位、表格—table標簽

一.position定位(relative | absolute | fixed | static)

1.position: static;

position 的默認值,元素沒有設置定位時的原有默認值。

2.position: relative; 相對定位

(1)相對元素的當前自身位子進行定位偏移;

(2)不會改變元素的默認表現(xiàn);

(3)主要用于絕對定位的組合,幫助絕對定位確定坐標.

3.position: absolute; ? 絕對定位

(1)定在文檔中的某個位置,不會改變;

(2)設置了絕對定位的元素,如果父級元素沒有設置absolute或者relative或者fixed,那么該元素會以文檔進行偏移,如果父級元素設置了absolute或者relative或者fixed,那么該元素會以父級元素進行偏移 。

4.position:fixed; ? ? ?固定定位

(1)固定定位會改變元素的行標簽和塊標簽的表現(xiàn),如:行級標簽定位后就可以設置寬高了? 參考float;

(2)一但給元素設定固定定位,float浮動就沒有效果了;

(3)以瀏覽器視窗定位的一種方式,可以設置負數(shù)。

拓展:

1.position:absolute | relative |fixed;

left:0;

right:0;

top:0;

bottom:0;

當出現(xiàn)四個方向時, 右 和 下 不生效;

2.border-radius:? ;設置圓角度

border-top-left-radius:? ? ;? border-top-right-radius: ? ? ; ? ?等設置相鄰兩邊間的圓角度。

3.float浮動、position定位(absolute) 可以使文檔脫離文檔流;

4.背景圖片、背景圖片位移、背景圖片尺寸、背景圖片平鋪的簡寫:

background: background-image ? background-position / background-size ? background-repeat;

二.表單—table標簽

1.table 表格 雙標簽? 表格級

th 行頭

tr定義行數(shù)

td 單元格

<tr>

? ? ?<th></th>

? ? ?<td></td>

? ? <td></td>

</tr>

2. rowspan、colspan、collapse

rowspan ? 合并行數(shù)

colspan? 合并列數(shù)

border-collapse:collapse;合并單元格邊線以及table外框之間的間隙

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
【社區(qū)內容提示】社區(qū)部分內容疑似由AI輔助生成,瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發(fā)布,文章內容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關閱讀更多精彩內容

  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標簽默認的外補...
    _Yfling閱讀 14,200評論 1 92
  • 各種純css圖標 CSS3可以實現(xiàn)很多漂亮的圖形,我收集了32種圖形,在下面列出。直接用CSS3畫出這些圖形,要比...
    劍殘閱讀 9,996評論 0 8
  • 1、垂直對齊 如果你用CSS,則你會有困惑:我該怎么垂直對齊容器中的元素?現(xiàn)在,利用CSS3的Transform,...
    kiddings閱讀 3,313評論 0 11
  • 轉載請聲明 原文鏈接地址 關注公眾號獲取更多資訊 第一部分 HTML 第一章 職業(yè)規(guī)劃和前景 職業(yè)方向規(guī)劃定位...
    前端進階之旅閱讀 16,920評論 32 459
  • 同學們: 在一個新的學校里,你們過得好嗎? 本來這是一封早就應該寫的信,有許多話早應該說,但是我沒有去寫,沒有去說...
    CooperNiu閱讀 1,362評論 7 9

友情鏈接更多精彩內容