html css筆記總結

2021-06-14 12:05:24 字數 1133 閱讀 8048

完整的html結構

樣式的引用

一。內部編寫

哈,我是乙個帥哥

是不是哦,我暈你

我看看行不行。

執行結果為:哈我是乙個帥哥  是不是哦,我暈你

我看看行不行。

解釋:「哈我是乙個帥哥」用的是absolute 絕對定位,它相對於第乙個div來定位,因為第乙個div是它的父級元素,將它包含在裡面。所以它出現在頂部起頭。(因為沒對其設定left 和top等)

「是不是哦,我暈你」也是absolute 絕對定位,它相對於第乙個div定位,設定了left值為160px,大於上乙個div的寬度,所以不會重合。

「我看看行不行」用的是relative 相對定位,它相對與父級元素定位,也就是第乙個div,它定位的位置從父級元素裡面的最開始位置算起,所以,如果不設定top的話就會和第二個div重合。而字型的大小一般為15px『

指定裁剪區域

position:absolute;

clip:rect(top right bottom left);

top:從上到下裁去top的長度。

left:從左到右裁去left的長度。

right:從左到右裁出right的長度。

bottom:從上到下裁出bottom的長度

將塊級元素轉化為字元級元素

display:inline;

將字元級元素轉化為塊級元素

display:block;

處理溢位

position:absolute;(必須為absolute)

overflow:visible;  //溢位區域可見

overflow:hidden;   //溢位區域不可見

overflow:scroll;   //溢位區域出現滾動條

盒模型

有 margin padding border width  height 

簡寫時安上右下左順序來寫

如:border-width:1em 2em 2em 2em

注意:上下左右這幾個屬性:

在設定時如果只出現3個值,則代表上 左右 下  

2個值: 上下  左右

1個值:全部  =出現4個一樣的值

插入多**

HTML CSS基礎總結

自學html和css,學習 為慕課網和w3school。html裡較為容易忘記的有以下 1,html的宣告如下 在xhtml中 宣告如下 html5中最簡便 2.html標籤 表示強調,斜體 表示更強烈的強調,粗體 短文本引用,長文字引用。輸入空格的方法 標籤引入文字 為橫線,預設灰色。一行 多行 ...

html css基礎總結

總結 常用的標籤 標題 段落粗體斜體 上標下標換行符 水平線加粗強調斜體引用 空格列表 有序列表 無序列表 定義列表 標籤 target blank 表示在新的視窗開啟預設 self 格式 jpg png gif h5中的語義標籤圖形和圖形說明 行 標題單元格 屬性 colspan跨列 rowspa...

HTML,CSS基礎總結

1.css可以提高 的復用性,將內容和表現分離。2.使用css的三種方式 行內式,內聯式,外聯式。檢查 f12 網路 重新整理頁面時載入兩個檔案 html,css。如果有乙個檔案沒有載入則表示載入時有問題。3.css常用選擇器 元素選擇器 元素名 類選擇器 類名 id選擇器 id名 並集選擇器 選擇...