H5 css3屬性隨筆

2022-07-25 09:09:08 字數 1636 閱讀 1776

padding 簡寫屬性在乙個宣告中設定所有內邊距屬性。

margin 簡寫屬性在乙個宣告中設定所有外邊距屬性。

placeholder 屬性提供可描述輸入字段預期值的提示資訊(hint)。

alt 屬性規定在影象無法顯示時替代文字。

在電腦鍵盤上,esc是escape(逃跑)的簡寫,ctrl是control(控制)的簡寫,而alt是alter(改變)的簡寫。

repeat:背景影象在垂直和水平方向重複。repeat-x背景影象將在水平方向重複。repeat-y背景影象將在垂直方向重複。no-repeat背景影象將只顯示一次。

margin:0 auto;使其左右居中

margin:上 右 下 左;

字型設定line-height使其上下居中

margin-left :與左邊的距離

letter-spacing:使字與字之間有一定距離

text-align:文字居中顯示

小技巧清除浮動的技巧:消除子元素浮動對父元素背景/邊框/不能被子元素撐開的方法

1. 父元素結尾處增加一空元素div,並清除其浮動。缺點:如果布局複雜,需要增加許多空標籤。

2.在父元素定義overflow:hidden(瀏覽器會自動檢查浮動區域的高度)

注:不必理會原理,知道用法即可。缺點:超出部分會被隱藏

3.利用偽類:after 父元素內容後增加空元素,並清除浮動。

:active 選擇器用於選擇活動鏈結。

當你在乙個鏈結上點選時,它就會成為活動的(啟用的)。

animation 屬性是乙個簡寫屬性,用於設定六個動畫屬性:

animation:lunbo 5s linear infinite;animation-direction:normal;
linear:勻速  infinite無限

display:flex;多欄多列布局

border-right:1px solid rgba(60,60,30,0.3);新增右邊灰色邊框

border-radius:圓角

input:focus{}的妙用

1.display:flex彈性盒子

2.overflow:hidden 超出隱藏

3.background可以同時新增兩張,同時設定浮動和大小

background:url(../img/15.png),url(../img/2.png);

background-repeat: no-repeat;

background-size:20px,20px;

background-position: left,right;

4.flex:1;設定?乙個數字,規定專案將相對於其他靈活的專案進行擴充套件的量。

flex知識:

5.border-radius:5px;設定圓角

6. :nthchild(n):見css選擇器

7.背景顏色線性漸變

background-image:linear-gradient(to bottom,#daaaaa,#e87373 80%,#daaaaa);

8.給字型加陰影

/*給字型加陰影 x y z*/

text-shadow:0 1px 1px rgba(0,0,0,0.8);

H5 Css3常見問題

1 a.無意義標籤 div,span 主要用來布局 b.一級標籤 body 乙個頁面中只有乙個 c.二級標籤 div,span d.標籤 p3 注釋的作用 更具可讀性,便於維護 4 css優先順序 行內樣式 外部樣式 內嵌式 就近原則 5 外邊距合併問題 1 父子級 給父級加邊框屬性 給父級加pad...

H5 CSS3前端簡單總結

div 是最常用的乙個盒子了,寫 的時候直接.a就直接生產 a div 了span 乙個行內元素,也就那樣ul li 最常用的乙個作為導航欄的標籤,然後就是ul li就直接生成,裡面一般包含a超連結 a 超連結,herf屬性指定他去哪,就填父絕子相 表示父盒子用絕對定位,因為這樣父盒子不脫標,還可以...

h5 css3相關新增屬性及標籤

1.多 標籤有兩個,分別是 音訊 audio 語法格式 多 標籤使用總結 多 標籤在不同瀏覽器下情況不同,存在相容性問題 button button disabled 選擇type search的輸入框 input type search 選擇類名以black開頭的 span class black...