css標籤和html標籤

2021-09-25 15:56:40 字數 3638 閱讀 2239

一,html

標題標籤:h1,h2,h3,h4,h5,h6

段落標籤:

水平線標籤:

換行標籤:

水平線標籤:

size----水平粗細線

width----水平線寬度

align----水平線對齊方式

color----水平線顏色

字型標籤(funt)

size----文字大小

color----字型顏色

face----文字的字型

標籤:src----連線到的位置

alt----替代文字

title----滑鼠停在上會提示文字

width----寬

height----高

超連結標籤:

排序列表:

無序列表:

排序,無序列表均為:

定義列表:

定義列表包含:描述;主體:

input控制項

type屬性:

text:單行文字輸入框

password:密碼輸入框

radio:單選按鈕

checkbox:核取方塊

button:普通按鈕

submit:提交按鈕

reset:重置按鈕

image:影象形式的提交按鈕

file:檔案域

下拉列表:

二.css

css字型樣式屬性:

font-size:字型大小

font-family:字型

font-weight:字型粗細

font-style字型風格

css外觀屬性

color:文字顏色

lint-height:行間距

text-align:水平對齊方式

text-indent:首行縮排

text-decoration:文字的裝飾

標籤顯示模式轉換 display

快轉行內:display:inline

行內轉塊:disolay:block

css背景

background-color:背景顏色

background-image:背景位址

background-repeat:是否平鋪

background-position:背景位置

background-attachment:背景固定還是滾動

背景語法:background-image : none | url (url) 

none : 無背景圖(預設的)url : 使用絕對或相對位址指定背景影象 

background-image 屬性允許指定乙個展示在背景中(只有css3才可以多背景)可以和 background-color 連用。 如果不重複地話,覆蓋不到地地方都會被背景色填充。 如果有背景平鋪,則會覆蓋背景顏色。

背景平鋪

語法:background-repeat : repeat | no-repeat | repeat-x | repeat-y 

repeat:背景像在縱向和橫向上平鋪(預設的)

no-repeat:背景影象不平鋪

repeat-x:背景在橫向平鋪

repeat-y:背景在縱向平鋪

盒子邊框

none:沒有邊框(預設的)

solid:邊框為單實線

dashed:邊框為虛線

dotted:邊框為點線

double:邊框為雙實線

盒子邊框總寫法:

上邊框:border-top-style:樣式; border-top-width:寬度;

border-top-color:顏色;border-top:寬度 樣式 顏色;

下邊框:border-bottom-style:樣式;border- bottom-width:寬度;

border- bottom-color:顏色;border-bottom:寬度 樣式 顏色;

左邊框:border-left-style:樣式; border-left-width:寬度;

border-left-color:顏色;border-left:寬度 樣式 顏色;

右邊框:border-right-style:樣式;border-right-width:寬度;

border-right-color:顏色;border-right:寬度 樣式 顏色;

樣式綜合設定:border-style:上邊 [右邊 下邊 左邊];

(none無(預設)、solid單實線、dashed虛線、dotted點線、double雙實線)

寬度綜合設定:border-width:上邊 [右邊 下邊 左邊];(畫素值)

顏色綜合設定:border-color:上邊 [右邊 下邊 左邊];(十六進製制;rgb)

邊框綜合設定:border:四邊寬度 四邊樣式 四邊顏色;

內邊距(padding)

padding-top:上內邊距

padding-right:右內邊距

padding-bottom:下內邊距

padding-left:左內邊距

外邊距(margin)

margin-top:上外邊距

margin-right:右外邊距

margin-bottom:下外邊距

margin-left:上外邊距

margin:上外邊距 右外邊距 下外邊距 左外邊

浮動(float)

float-left:元素向左浮動

float-right:元素向右浮動

float-元素不浮動(預設的)

定位(position)

top:頂端偏移量,定義元素相對於其父元素上邊線的距離

tottom:底部偏移量,定義元素相對於其父元素下邊線的距離

left:左側偏移量,定義元素相對於其父元素左邊線的距離

right:右側偏移量,定義元素相對於其父元素右邊線的距離

static:自動定位(預設定位方式)

relative:相對定位,相對於其原文件流的位置進行定位

absolute:絕對定位,相對於其上乙個已經定位的父元素進行定位

fixed:固定定位,相對於瀏覽器視窗進行定位

static:靜態定位

relative:相對定位

absolute:絕對定位

display:顯示

display : none 隱藏物件 與它相反的是 display:block 除了轉換為塊級元素之外,同時還有顯示元素的意思。

overflow溢位

visible : 不剪下內容也不新增滾動條。

auto :  超出自動顯示滾動條,不超出不顯示滾動條

hidden : 不顯示超過物件尺寸的內容,超出的部分隱藏掉

scroll : 不管超出內容否,總是顯示滾動條

滑鼠樣式:cursor

cursor :  default  小白 | pointer  小手  | move  移動  |  text  文字

vertical-align:垂直對齊

word-break:自動換行

normal 使用瀏覽器預設的換行規則。

break-all 允許在單詞內換行。

nowrap : 強制在同一行內顯示所有文字,直到文字結束或者遭遇br標籤物件才換行。

可以處理中文

text-overflow:文字溢位

HTML和CSS基本標籤

一 標籤分類 1 塊級元素 2 行內元素 二 標籤的特點及作用 1 塊級元素在瀏覽器中獨佔一行,兩個塊級元素不能一行顯示,他們會自動換成兩行,2 塊級元素可以設定寬高等屬性。3 行內元素可以多個在一行顯示。4 行內元素不能設定寬高屬性,它的寬高是由元素中的內容多少而確定的,內容多則大由寬,內容少則小...

HTML和CSS常用標籤

背景圖 background image 邊框的樣式 批量建立 父元素 子元素 屬性 span標籤 在行內定義乙個區域,也就是一行內可以被劃分成好幾個區域,從而實現某種特定效果。本身沒有任何屬性。例子logo標籤 g o o g le 標題巢狀的過程中,必須先結束的靠近內容的標題,再按照由內及外的順...

補充 HTML標籤和CSS

角標標籤 上角標 sup 下角標 sub x2 y2 z2 h2o 文字加粗 b標籤strong加強版文字加粗,具有語氣強調的特性 夜雨染成天水碧。有些人不需要姿態,也能成就一場驚鴻。夜雨染成天水碧。有些人不需要姿態,也能成就一場驚鴻。夜雨染成天水碧。有些人不需要姿態,也能成就一場驚鴻。斜體標籤 e...