1. 程式人生 > >css3在工作中運用上的總結(圓角、內陰影、外陰影)

css3在工作中運用上的總結(圓角、內陰影、外陰影)

//陰影水平偏移值(可取正負值);陰影垂直偏移值(可取正負值);陰影模糊值;陰影顏色

陰影效果

-moz-box-shadow: 0px 5px 10px rgba(0,0,0,0.2);
-webkit-box-shadow: 0px 5px 10px rgba(0,0,0,0.2);
box-shadow: 0px 5px 10px rgba(0,0,0,0.2);

內陰影

-moz-box-shadow: 5px 5px 5px #999 inset;
-webkit-box-shadow: 5px 5px 5px #999 inset;
box-shadow: 0px 0px 8px #dfdfdf inset;

內陰影和外陰影同時有陰影:

box-shadow: 0px 5px 8px #bbbbbb inset,0px 1px 0px #83d490;

box-shadow: 0px 0px 10px rgba(0,0,0,0.8) inset,0px 0px 5px rgba(200,200,200,0.5);

圓角:

-moz-border-radius: 1em;
-webkit-border-radius: 1em; border-radius: 1em;

漸變背景:

background-color: #04D426;

background-image: -webkit-gradient(linear,left top,left bottom,from(#0dbd2a),to(#05a51f));

background-image: -webkit-linear-gradient(#0dbd2a,#05a51f);

background-image: -moz-linear-gradient(#0dbd2a,#05a51f);

background-image: -ms-linear-gradient(#0dbd2a,#05a51f);

background-image: -o-linear-gradient(#0dbd2a,#05a51f);

background-image: linear-gradient(#0dbd2a,#05a51f);

相容各瀏覽器 背景透明文字不透明的解決辦法:其中
filter:progid:DXImageTrans

Form.Microsoft.gradient(startColorstr=#70000000,endColorstr=#70000000);

是解決ie各瀏覽器的辦法,用background-color:#000\9不能達到想要的效果;
.map_summary{width:auto;height:39px;bottom:0;left:0;background-color: rgba(0, 0, 0, 0.6); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#70000000,endColorstr=#70000000);_background-color:#000; _filter: alpha(opacity=60); zoom: 1;padding:0px 50px;}

相關推薦

css3工作運用總結(圓角陰影陰影)

//陰影水平偏移值(可取正負值);陰影垂直偏移值(可取正負值);陰影模糊值;陰影顏色 陰影效果 -moz-box-shadow: 0px 5px 10px rgba(0,0,0,0.2); -webkit-box-shadow: 0px 5px 10px rgba(0,0

vim 的各種用法,很實用哦,都是本人是在工作學習和總結

運維 列表 vim編輯 一個 .com 設置 windows ati 有意義 (一)初級個性化配置你的vim 1、vim是什麽? vim是Vi IMproved,是編輯器Vi的一個加強版,一個極其強大並符合IT工程師(程序員、運維)習慣的編輯器。如果你是一名職業的SE,那麽

git在工作的用法總結-環境安裝篇

使用git有很長一段時間了 ,平時用到的時候都是直接google,經常用到的一些也記錄在筆記中,但有時候筆記太多,實在是太亂了(其實是我太懶~ 哈?),找都要半天的時候還不如直接google,今天有空索性將以前的筆記整理一下發在部落格中,便於今後檢視,關於git的使用,這裡我打算分開寫,分為環境安裝篇和

git在工作的用法總結-使用篇

上一篇介紹了git的環境安裝配置,本篇對git在工作中常用的用法進行總結,已滿足大部分的日常工作需求,對於其他的一些git命令用法在今後使用到時我也會更新上來,文中如有錯誤,歡迎大家指出來,謝謝~ 一、git本地基礎用法 1、建立程式碼倉庫 git init 2、加入所有目錄到倉庫 git a

簡單的級聯下拉(作為工作的一點總結~)

級聯下拉(作為工作中的一點總結~) <script> var codeArr = ["請選擇","CNY","AUD","JPY","USD","HKD","EUR","GBP"]; var nameArr = [["請選擇"],["人民幣"],

shell從入門到工作常用命令總結

shell命令用過很長一段時間了,工作之餘也沒有多總結這些知識,快過年了這段時間工作不忙,總結一下shell的技術~ 1.入門介紹 *shell是一個用c語言編寫的程式,它是使用者使用linux的橋樑

iOS工作的經驗總結—馬甲包稽核以及常見稽核問題

1、蘋果近期稽核動態分析  2、2018年App Store演算法重大調整首次曝光一、蘋果近期稽核動態分析1、機審越來越完善眾所周知,應用在上架至App Store前,必須通過神祕的蘋果稽核團隊的稽核。能否在短時間內順利通過稽核,對App推廣節奏和策略、以及迭代等的應該是非常大的!首先講一下提審的流程目前應用

C++ 語言的重載缺省參數隱式轉換等機制展現了很多優點

str 指針 div sin code console etc 聲明 隱患 C++ 語言中的重載、內聯、缺省參數、隱式轉換等機制展現了很多優點,但是這些 優點的背後都隱藏著一些隱患。正如人們的飲食,少食和暴食都不可取,應當恰到好處。 我們要辨證地看待 C++的新機制,應該恰

Java的巢狀類部類靜態部類

在Java中我們在一個類的內部再定義一個類,如下所示:class OuterClass { ... class NestedClass { ... } }那麼在上面的例子中我們稱OuterClass為外圍類(enclosing clas

java部類總結 問題:部類靜態部類區別使用場景?

問題:內部類、靜態內部類區別、使用場景?1.靜態內部類可以有靜態成員(方法,屬性),而非靜態內部類則不能有靜態成員(方法,屬性)。2.靜態內部類只能夠訪問外部類的靜態成員,而非靜態內部類則可以訪問外部類的所有成員(方法,屬性)。3.例項化方式不同:(1)例項化成員內部類“”通

mysql的自然聯結聯結聯結

1.自然聯結 定義:無論何時對錶進行聯結,應該至少有一個列出現不止一個表中(被聯結的列)。標準的聯結返回所有資料,甚至相同的列多次出現。自然聯結排除多次出現,使每個列只返回一次;(也就是說,自然聯結

linq介紹及工作應用兩例——左聯與聯,linq迴圈方法

[toc] #1 linq介紹 ##1.1 linq產生背景 一個應用服務後臺程式,肯定會需要格式各樣的資料檢索跟操作,而這些資料在過去的這些年裡一般都會包含在關係型資料庫或者xml檔案中。 .Net3.5版本發行之前,傳統的資料來源訪問方式就是直接對資料庫或者xml檔案進行檢索操作。在.Net3.5 V

linux服務器性能(網卡流量CPU磁盤使用率)監控

平均值 行數據 blog sar 處理 行為 amp 利用 %d   廣義的網站的監控涵蓋所有的非業務行為的數據采集與管理,包括數據分析師和產品設計師使用的網站用戶行為日誌、業務運行數據,以及供運維工程師和開發工程師使用的性能統計數據等。 本文主要是通過shell

Java基礎面試:集合部類線程

public 死鎖 exceptio read 多線程 三種 xtend arraylist 表示 package test; import java.util.Hashtable; import java.util.Map; public class test {

finalstatic代碼塊靜態代碼塊部類代碼執行順序

調用 logs 構造代碼塊 tro 而且 classes phi println tina final final域使得確保初始化安全性(initialization safety)成為可能,初始化安全性讓不可變形對象不需要同步就能自由地被訪問和共享 作用在類上

Java面向對象(staticfinal匿名對象部類修飾符代碼塊)

固定 介紹 常量 屬於 權限 功能 復雜 art 代碼區 面向對象 今日內容介紹 u final u static u 匿名對象 u 內部類 u 包的聲明與訪問 u 四種訪問修飾符 u 代碼塊 第1章 final關鍵字 1.1 final的概念 繼承的出現提高了代碼的復用性

adb命令檢測apk啟動時間CPU使用情況流量電池電量等——常用的adb命令

serial 信息 proc idg 情況 電量 pid art str ADB:Android Debug Bridge,是Android SDK裏一個可以直接操作安卓模擬器或真實設備的工具,頗為強大。 檢測APP: adb shell am start

linux系統查看CPU磁盤版本等信息

需要 適合 release opp gpo code 核數 sda rip 【聲明】 本篇博客內容均來自網友的博客,本篇只是進行匯總整理,以方便自己查看。 參考資料:https://www.cnblogs.com/xubiao/p/6497533.html      h

計算機組成和CPU硬盤三者之間的關系

獨立 mage mat 截屏 大腦 -h 發送 被人 class 電腦之父——馮·諾伊曼 提出了組成計算機的五大部件:輸入設備、輸出設備、存儲器、運算器和控制器。 來看一下現在我們電腦的:鍵盤鼠標、顯示器、機箱、音響等等。 這裏顯示

Python收集Linux(Ubuntu環境測試過)系統信息——CPU磁盤網卡

python收集linux系統信息#!/usr/bin/python # coding:utf-8 import os import json import socket import psutil class Host: _hostname = socket.getfqdn(socket.get