HTML學習筆記一

2022-05-24 16:51:09 字數 2332 閱讀 9571

html學習筆記一

input框的屬性:

border ,outline(光標點入輸入框的時候,出現的外邊框,可以通過設定`『這裡設定輸入框的邊框為0,滑鼠點選的時候不會出現外邊框)

如果input框中的游標和前面的logo還有一定的距離可以將input框設定margin,然後去掉input框的border和outline屬性,並設定背景為空白,就可以實現了。

在做網頁的時候由於大部分都是採用的微軟雅黑,所以可以直接利用body進行設定。

浮動的清除問題:我們利用float:left;設定元素進行浮動,將元素脫離文件流,對於不需要浮動的元素,就要進行浮動的清除,

下面我們如果將藍色的盒子設定為清除浮動,獨立與第二行存在

那麼對於藍色的盒子我們進行如下的設定style="clear:both;"

製作**的導航欄的時候,一般導航欄的寬度是設定為100%的,而這裡的100%是相對於父級而言的,也就是包裹了導航欄的div來說的。

css的定位問題:position有三個屬性值,分別是相對定位:relative 絕對定位:absolute ; 固定定位:fixed;

相對定位:是div相對於自身原來的位置進行top/right/bottom/left的位置定位

絕對定位:是div相對於瀏覽器的左上角進行定位。

對於導航欄中的選項我們一般採用無序列表進行設定,同時將裡面的的的前面的點號去掉ul這裡可以設定為公共樣式,凡是採用了無序列表的地方都能夠直接去掉前面的點號。然後在將的樣式設定為左浮動.class li

要設定文字在div中垂直對齊我們可以在寫有文字的元素裡面設定style屬性的行高line-height等於div的高度,比如乙個div裡面有個無序列表,那麼我們就可以在元素裡面 設定行高.div-class li

這裡還需要設定每個元素 之間的距離,可以用padding來表示。其實也可以用margin來表示,利用padding我們是以元素為中心向四周設定間距。.div-class li/*這裡上下表示0px 左右表示18px padding只有兩個元素的時候,第乙個表示上下,第二個表示左右*/

列表的分類 :

有序列表:(order list)

無序列表:(unouder list)

定義列表:(definition list)(definition title)(definition declaration)

標籤新增滑鼠停留的時候顯示相應的文字利用title屬性

去掉標籤的下劃線 可以新增到公共樣式裡面,然後設定**如下:a如果還要繼續設定的話可以在具體的div裡面進行設定.div_class a

如果還要設定滑鼠停留的時候的顏色或者樣式的變化可以利用hover屬性進行設定

.div_class a:hover

同樣的對於元素 也可以進行hover屬性的設定 比如我們的導航欄中的列表當有滑鼠移動上去的時候,可以改變背景的顏色或者列表的字型的大小等。.div_class li:hover

超連結的屬性設定利用text-decoration進行設定

超連結的偽類有四個:a:link/*這是標籤的原始屬性*/ a:hover /*這是滑鼠懸停的時候*/ a:acitve /*這是滑鼠點選之後還沒有鬆開的時候*/ a:visited/*這是訪問之後的樣式*/對於這些偽類的屬性不僅僅只有標籤 有,其他的元素都可以進行偽類屬性的設定,比如我們的或這div都可以設定 ,其中用的最多的就是hover屬性。.div-class img:hover/*這是設定滑鼠懸停在的上方時將邊框設定為1px*/

HTML學習筆記 一

1.什麼是html?html是用來描述網頁的一種語言。html指的是超文字標記語言,不是一種程式語言,而是一種標記語言 markup language 標記語言室一套標記標籤,html使用標記標籤來描述網頁。2.html標籤?html標記標籤通常被稱為html標籤 html tag html標籤通常...

HTML 學習筆記(一)

hello world html 標題 heading 是通過this is heading 4 this is heading 5 this is heading 6 請僅僅把標題標籤用於標題文字。不要僅僅為了產生粗體文字而使用它們。請使用其它標籤或 css 代替。html 段落是通過 標籤進行定...

html學習筆記(一)

1.html 標題 heading 是通過 等標籤進行定義的。2.html 段落是通過 標籤進行定義的 3.html 鏈結是通過 標籤進行定義的。4.html 影象是通過 5.換行標籤 6.document.write 可以寫html標籤,但是如果這個語句出現在函式中就會重寫頁面 7.style 指...