實用css集合

2021-09-01 22:37:43 字數 2556 閱讀 6742

樣式清空

方案1:

@charset "utf-8";

/* css document */

body, div

dd, dl, dt, form, h1, h2, h3, h4, h5, h6, img, input, li, p, span, ul, ol

img

a:link, a:visited

dd, li

.none

.clearfloat

::-moz-selection

::selection

a:focus, input

.fl

.fr

.clearfix:after

.clearfix

方案2:

@charset "utf-8";

/* css document */

html,

body

body,

div

img,

input,

form,

dl,p,

dd,dt,

ul,li,

h1,h2,

h3,h4,

h5,h6,

span

img

a:link,

a:visited

li,dd

.none

.fl

.fr

.clearfloat

body

2.垂直對齊

.verticalcenter
3.跨瀏覽器的影象灰度

img
4.用css動畫實現省略號動畫

.loading:after 

@keyframes ellipsis

to }

5.跨瀏覽器的透明

.transparent
6.通用**查詢

/* smartphones (portrait and landscape) ----------- */

@media only screen

and (min-device-width : 320px) and (max-device-width : 480px)

/* smartphones (landscape) ----------- */

@media only screen and (min-width : 321px)

/* smartphones (portrait) ----------- */

@media only screen and (max-width : 320px)

/* ipads (portrait and landscape) ----------- */

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px)

/* ipads (landscape) ----------- */

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape)

/* ipads (portrait) ----------- */

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait)

/* desktops and laptops ----------- */

@media only screen and (min-width : 1224px)

/* large screens ----------- */

@media only screen and (min-width : 1824px)

/* iphone 4 ----------- */

@media only screen and (-webkit-min-device-pixel-ratio:1.5), only screen and (min-device-pixel-ratio:1.5)

7.自定義文字選擇

::selection 

::-moz-selection

::-webkit-selection

8.錨鏈結偽類

a:link 

a:visited

a:hover

a:active

9.全屏背景

html
10.內容垂直居中

.container

MySQL 實用 SQL 語句集合

寫在前面的話 本文主要用於記錄工作中不經常使用但是偶爾用到又非常有用的 sql 語句,持續不斷不定期更新。資料庫大小統計 1.檢視 mysql 某個庫的所有表大小,記錄數,占用空間等。select table name,data length,index length,data length ind...

css幾種實用方法

在要用時選取那段文字,再在css面板上點一下 bgstyle 就行了。8 如何給部分文字加背景影象?與加背景色操作類似,中是在背景在選擇載入圖象就是了,乙個定義好的加背景圖象的css例子的 是這樣的 在要用時選取那段文字,再在css面板上點一下 imgbgstyle 就行了。9 如何使頁面的背景在文...

css 實用筆記

呈現類似打字機或者等寬的文字效果 font family monospace monospace字型固定寬度 顯示斜體文字效果 font style italic 呈現粗體文字效果font weight bold 呈現大號字型效果 font size larger 呈現小號字型效果 font siz...