目前分類:程式相關 (29)

瀏覽方式: 標題列表 簡短摘要

 

Stack Overflow是一個程式設計領域的問答網站,在過去一年統計了超過50,000 份程序員的調查問卷
 

關於程序員

開發者中(認為自己是)全能工程師居多(28.0%)

全能工程師中最受歡迎的技術是JavaScript(85.3%)

移動端開發中最受歡迎的技術是Android(61.9%)

相對於「程式設計師」和「工程師」,大部分人(71.6%)覺得自己是「開發者」

年齡介於25-29 歲之間的最多(28.4%)

程序員中九成是男性

 

關於技術

最受常用的語言依然是JavaScript (55.4%)
最愛的語言是Rust (79.1%)Swift 次之(72.1%)

最怕的技術是VB (79.5%)WordPress 次之(74.3%)

最想學的是Android (15.8%) Node.js 次之(14.8%)

最受歡迎的開發環境Notepad++ 和Visual Studio 並列第一(35.6%)

OS X 超越Win7 成為最受歡迎的操作系統(26.2%)

 

 

關於工作


工作中最大的難題是:不切實際的預期、差勁的文檔和需求不明
決策崗位(VP、CTO、CIO)薪酬最高

公司員工人數多在20 - 99 人之間(22.0%)

 

文章標籤

AJlin-DES鼎益盛 發表在 痞客邦 PIXNET 留言(0) 人氣()

摘要:騰訊大數據發布了移動頁面用戶行為報告,內涵包括加載、高峰期、頁面熱度、流失率等關鍵點。
1、加載加載超過5秒就會有74%的用戶離開頁面。
2、高峰期中午12點左右和晚上10點左右是頁面訪問高峰期。
3、頁面熱度通過用戶口碑擴散的移動頁面,其訪問熱度往往持續兩天左右。
4、操作習慣大多數用戶習慣滑動切換,放置在左邊的按鈕點擊率低。
5、流失率...
 

騰訊大數據發布了移動頁面用戶行為報告,內涵包括加載、高峰期、頁面熱度、流失率等關鍵點。

1、加載

加載超過5秒就會有74%的用戶離開頁面。

2、高峰期

中午12點左右和晚上10點左右是頁面訪問高峰期。

3、頁面熱度

通過用戶口碑擴散的移動頁面,其訪問熱度往往持續兩天左右。

4、操作習慣

大多數用戶習慣滑動切換,放置在左邊的按鈕點擊率低。

5、流失率

用戶隨著頁面層級的加深而不斷流失,流失率在前幾頁最高。

6、流失率

輸入行為或者復雜交互行為會導致用戶流失。

7、轉化率

由H5頁面引導去下載APP的轉化率平均值為11.3%,最高值為36.6%。

由H5頁面引導去打開APP的轉化率平均值為17.52%,最高值為63.83%。

8、分享率

H5頁面的分享率平均值為3.93%,最高值為22.39%。

(原數據:H5頁面的分享率平均值為11.69%,最高值為43.22%。

原數據是頁面分享按鈕點擊率,現更新為微信/手Q右上角點擊分享成功後收集的數據。)

9、頁面壽命

長期、固定位置的資源投放可以延長移動頁面生命週期。

10、停留時長

功能型頁面的平均停留時間比展示型頁面的平均停留時間長。

11、停留時長

頁面首屏和最後一屏的平均停留時間比中間頁面的平均停留時間長。

12、按鈕點擊

按鈕擺放在第一屏的點擊率最高,第二屏驟減,最後一屏回升。

13、按鈕點擊

同樣功能的按鈕,名字設置影響點擊率。

14、按鈕點擊

動畫明顯的元素更容易引起用戶注意並點擊。

15、頁面提示

用戶可能會忽略頁面提示直接開始頁面交互。

16、操作習慣

用戶習慣沿用上一屏學習到的操作行為,如果當前操作不同,需要提示用戶。

文章標籤

AJlin-DES鼎益盛 發表在 痞客邦 PIXNET 留言(0) 人氣()

1.不要濫用類
在有意義的地方使用ID而不要使用類。這是一個使得瀏覽器能夠更快訪問DOM元素的方法。

2.不要把一切都扔進一個CSS文件中
分區CSS使其更易於管理。每一個CSS文件都可以分解成例如header.css、footer.css等邏輯組件。

3.不要命名選擇器為“.red-with-green-dashed-lines”(紅綠虛線)
根據頁面上的組件命名你的選擇器。例如:“header-left”,“content-title”或“content-date”更具描述性。

4.不要忘記註釋
註釋在CSS中非常重要,可用來理解每個樣式如何與其他樣式關聯以及什麼顏色方案適用於哪些組件。

5.不要害怕開發工具
現在的每個瀏覽器都有自己的一套開發工具,通常是按F12。這些工具在“調試CSS”時至關重要。

6.不要害怕覆蓋
當然,CSS框架,例如Bootstrap和Foundation都較為巨大,但每一個都需要根據你的需要做出一點調整。當你得到一個更新的框架時,它將覆蓋你的改變。與其深入挖掘龐大的CSS文件,還不如創建一個bootstrap-overrides.css文件,按照你的意願調整框架,只是…

7.不要濫用!很重要
CSS的整體思路是,從一個到另一個地“層疊”樣式。!重點是要記住排雷一樣地踏遍所有早先的樣式。: -)

8.不要使用大量網絡字體
這也是顯而易見的,但有些人就是喜歡自己排版。只在網站上使用一個或兩個(最多三個)網絡字體,然後回歸到瀏覽器默認設置,以保持網站的優化。

9.不要手動編碼所有的CSS
為了保持CSS的DRY,可以使用CSS預處理程序例如LESS或SASS。使用這些預處理器的最大好處是,你可以定義變量,例如在上面定義配色方案,然後重複使用到所有CSS,而不必當你需要修改的時候追踪每個顏色。

10.不要讓C​​SS過於“臃腫”
空格會佔用CSS文件的空間空間。由於我們都希望我們的CSS能夠快速加載,因此在部署到網站之前最好使用CSS壓縮工具來一次瘦身。

文章標籤

AJlin-DES鼎益盛 發表在 痞客邦 PIXNET 留言(0) 人氣()

主機提供商 價錢 磁盤空間 帶寬 額外功能 退款 更多信息
 
 
$ 4.95 無限 無限 自由
 
無限託管域
 
$ 100個谷歌AdWords的積分
任何時候
2
 
$ 4.89 無限 無限 自由
 
$ 250免費廣告信用
 
域名隱私
90天
3
 
$ 3.75 無限 無限 自由
 
無限託管域
 
$ 100個谷歌AdWords的積分
任何時候
4
 
$ 2.95 無限 無限 自由
 
無限託管域
 
$ 100個谷歌AdWords的積分
 
技術100%風能
任何時候
 
$ 4.95 無限 無限 終身免費
 
無限託管域
 
$ 50免費營銷學分
 
$ 30關Copuon代碼:TODAYOFFER
 
300%風力綠色動力託管
30天
6
 
$ 3.15 無限 無限 自由
 
無限託管域
 
$ 100個谷歌AdWords的積分
 
技術100%風能
30天
7
 
$ 4.95 無限 無限 自由
 
無限託管域
 
$ 100個谷歌AdWords的積分
任何時候
8
 
$ 3.95 無限 無限 自由
 
無限託管域
 
2免費專用IP地址
 
七天免費試用
30天
9
 
$ 3.99 無限 無限 自由
 
無限託管域
 
$ 200自由市場學分
30天
10
 
$ 4.95 無限 無限 自由
 
無限託管域
 
SSH和支持的cronjob
30天

AJlin-DES鼎益盛 發表在 痞客邦 PIXNET 留言(0) 人氣()

手機版網站直接撥打電話網站優化

網站優化第一首要條件,就是讓消費者或客戶快速與你連繫

消費者在第一時間看搜尋到你的網站,看到網站電話,盡可能的方便消費者才提高來店轉化率

是網路行銷的最最最重要的核心價值之一

難用的網站只會讓消費者不顧一切的離開你,轉而尋找其他店家

傳統的手機版網站要讓消費者打電話到你那消費需要以下流程

搜尋到你的網站-->滑到最底下-->記電話-->縮小視窗-->開啟撥電話視窗-->把默念的電話輸入進去-->被旁邊的人一吵又忘記了-->在開啟視窗-->滑到最底下-->背你的電話-->縮小視窗-->開啟撥電話功能-->輸入電話-->與店家通話

經過鼎益盛的手機版網站優化之後,消費者撥電話給你的流程變成

搜尋到你的網站-->滑到最底下-->看到號碼,按下確定撥號-->與店家通話

從14個步驟縮減到4個步驟,這個看似無所謂的細節,卻能幫你挖出更多潛在的客戶,因為你無法想像在那14個步驟之中,你損失了多少客戶

鼎益盛的專業,是提供您實際能解決網路行銷痛點的方案,讓您的網站增加搜尋轉化率,產生真正的經濟價值

 

手機版網站直接撥打電話優化功能範例網址:joomla教學SEO優化手機版網站直接撥打電話語法

 

文章標籤

AJlin-DES鼎益盛 發表在 痞客邦 PIXNET 留言(0) 人氣()

https://connoratherton.com/loaders

 

各種加載 進度條語法下載

http://usablica.github.io/progress.js/

文章標籤

AJlin-DES鼎益盛 發表在 痞客邦 PIXNET 留言(0) 人氣()

2016-02-12 by 鼎益盛 AJ Lin 

勒索程式是由俄羅斯或烏克蘭的一組駭客集團製造散佈

Crypt0L0cker是CryptoLocker的進化版,英文字o變成數字0,其意思代表Cry-Pay-To-Locker,駭客集團用意很清楚直白的告訴全世界,他們目的就是要錢,和以前只是讓你電腦使用不順暢比起來,Crypt0L0cker只能用窮凶惡極來形容,鼎益盛把這次勒贖軟體的國家來源,操作方式,解檔案流程,可能中毒管道做了一個全攻略整理。

根據紐約時報對於勒贖軟體的相關報導(原文連結):

" 安全公司索佛斯說,據信是在俄羅斯或烏克蘭的一組駭客,略多於一個月的時間裡就得手約值1650萬美元的比特幣,受害人主要在美國"

" 國際當局合組的聯盟2014年年中查獲CryptoLocker集團,揪出主謀是30歲俄國人葉夫根尼.鮑加契夫,該集團說已將軟體散布至23萬4000台電腦。其後,更惡毒的病毒株不斷出現,多數在CryptoWall名下。"

" 2014年底,「戴爾安全工作室」說,CryptoWall已感染逾80萬台電腦。其後,該惡意軟體的新版如TorrentLocker和Dirty Decrypt經常現身。"
" 新罕布夏州德爾罕警局2014年6月遭CryptoWall攻擊,但拒付贖金,並成功轉到備份文件。但最近,田納西州迪克森縣、麻州圖克斯伯里市的警局基於七萬多筆的刑事紀錄和鑑定,都選擇支付約500美元的贖金。"

Crypt0L0cker是2015與2014卡巴斯基發布破解的CryptoLocker不同(最初是其中一個分支被警方查獲,警方把相關軟體交給卡巴斯基,再由卡巴斯基研究再製發佈解密及預防疫苗程式,後來沉寂了一段時間,2015年捲土重來受害災數以三倍的速度成長,國外媒體稱為 <索馬利亞海盜電腦綁架>估計一天有3000萬美金的進帳,而全球的執法單位都束手無策。

目前這個方式犯罪方式還無法破解,日益增大的組織也讓聯合國擔心,勒索來的比特幣會讓沒有法律的Deep web非法活動更為猖狂(毒品交易、軍火買賣、買兇殺人、暴力色情)在美劇《紙牌屋》第二季有個請駭客追查暗殺真相的橋段就是描述Deep web,為了力求還原劇情的真實性甚至邀請了真正的網路駭客Gregg Housh充當顧問,Deep web一般人無法進入,必須透過tor,這也是為什麼中國大陸要嚴密控管網路,大陸著名的駭客交流論壇就是由人民解放軍管理的。

Crypt0L0cker的主要特徵就是所有檔案都會變更檔名為.encrypted這是用2048bit的RSA加密運算方式產生,現今網路銀行轉帳的網址SSL加密也只用到 128bit 加密而已,能破解RSA-2048bit的只有一個名為<秀爾算法>的,需要用量子電腦來算,但這並不是凡人所能接觸到的設備。

“破解RSA-2048(2048-bit)的密鑰可能需要耗費傳統電腦10億年的時間,而量子電腦只需要100秒就可以完成。”

  ——Dr. Krysta Svore, 微軟研究院

勒索軟體主要是透過 Flash 、Java 、微軟漏洞偽裝隱身的木馬病毒

Crypt0L0cker的真面目是TorrentLocker這變種病毒已經進步到你無法想像的地步,主要是偽裝成 Flash、JAVA、PDF、提高電腦效能的小軟體、隱藏在廣告視窗裡甚至沒有廣告,甚至是一個看起來無意義的空白彈出視窗,只要不小心點擊到就會觸發下載程式,這個木馬病毒會不斷改版進化逃過防毒軟體完成下載流程,更遑論手機用戶大部分都沒有安裝防毒軟體,如果手機又和電腦同步,很容易就在電腦裡埋下駭客的勒贖軟體程式,01上面就有苦主說他的小紅傘根本沒反應,受災戶也包含許多Windows7 和 MAC的使用者,這也就是為什麼各大瀏覽器都宣布Flash對安全有危害的放棄不再支援flash主要原因之一Crypt0L0cker勒索程式也一直在公開招募被害者加入犯罪,協助更新技術,分享勒索利潤,讓防毒軟體公司及全球執法單位都面臨前所未有的挑戰。

簡單的說,如果不太常使用電腦的人,在網路上追劇,或看線上版盜版電影,若跳出一個視窗<請更新Flash來觀看影片> <請下載擴充套件來觀賞影片>,大部分民眾是不會有戒心馬上想到這就是病毒的。 而且!不管手機、MAC、PC 都會互相流通,會有潛伏期,不會馬上發病,一開始硬碟讀取會變慢,再來會開始加密你的檔案,若電腦無故高速運轉,一直在讀資料,先立刻斷網,若持續再高速運轉,建議馬上關機,想辦法用其他電腦來讀正常的檔案或檢測,勒贖軟體在加密檔案的時候,原來的檔案會刪除,留下已經加密的那個,如果你技術夠好試試用反刪除軟體能不能救回來,只能碰碰運氣,因為Crypt0L0cker已經強化到中毒之後無法再安裝軟體,就算能裝也不一定能使用,也會啟動Crypt0L0cker的報復機制。

1.就算電腦會自動更新,還是會中招的,因為大部分的人並不會隨時去記住flash版本更新號碼,一般民眾不會想到,國中的女兒只是要上網看個韓劇,出現一個視窗<觀看影片需要請更新flash>就把勒索軟體下載了。不論Crypt0L0cker偽裝成甚麼檔案,或由甚麼途徑散佈,都必須要<點擊>才會<觸發下載>

2.這個變種木馬在2015年下半年被發現,進化了強大的隱身功能,讓使用者點了惡意網站,當下並不會有反應,Crypt0L0cker的檔案也很小,可能不到500K,也極有可能你只是在小螢幕的裝置要關掉flash的廣告視窗,一不小心手滑,或讀載顯示的太慢,要點叉叉關掉視窗的,卻因為畫面leg位移,就不小心點了惡意廣告

3.而大部份的網站主並不曉得自己的網站被駭客竄改語法變成散布木馬病毒的殭屍網站了,只要透過 flash 和 java就能當作媒介慎選網路主機商非常重要,切勿使用免費的主機空間,趨勢科技就協助查獲一個免費主機商其實就是後門木馬程式的共犯

4.防毒軟體就算更到最新,也不一定會防禦的了,邏輯就是要有毒藥才能製作解藥,等你解藥做出來,新的毒藥也出來了,如果到處都有解藥,駭客也不會花時間做毒藥,這也是為什麼全世界的災情越來越慘重讓美國田納西州迪克森縣、麻州圖克斯伯里市的警局也只能付贖金保住七萬多筆的刑事紀錄和鑑定的原因

5.Crypt0L0cker和其他木馬犯罪病毒聯手企業化經營了,例如:側錄網路銀行鍵盤的木馬後門程式,現在駭客犯罪還有直銷抽成制度,廣招有技術背景的人加入他們更新技術分享利潤,忍不住懷疑台灣已經有代理商協助他們,所以你如果常用網路銀行的話首要先更新金融卡密碼以防萬一。

6.根據防毒軟體公司統計7-8成的受災戶都是微軟,其中又以window7和XP是最大比例,因為蘋果幾年前就宣布不支援Flash和Java了,要在Apple上架的app也規定不能有java(Apple的用心真的是時間來證明的)。

相關文章: Apple 2010年宣布不支援JAVA         勒贖軟體偽裝成JAVA更新騙使用者點擊下載

發現中毒之後請先確定電腦裡面的備份是否還在,是否被加密,檔名是否正常

目前世界上並沒有任何一間防毒公司能憑單一檔解免費幫你解encrypted檔的2048bit加密檔案,只有加密者有唯一的encrypted解密金鑰,除非你中的是舊版的勒索軟體,若剛好是卡巴斯基2014年釋出的,破解的成功率可以提高三成,建議還是可以碰碰運氣,鼎益盛整理了一些網路上流傳的解encrypted的方法大致分為下列:

1.找出你幾個檔案是<加密前>及<加密後的>提供給這間大陸防毒軟體公司Dr.Web讓他們試試看,但必須購買他們軟體提供你的客戶購買序號才能受理,Dr.Web也表示無法100%破解,從你寫信到受理也會有流程天數,也無法在兩三天之內完成解密把檔案寄還給你

破解勒贖軟體解encrypted檔大陸防毒軟體公司:Dr.Web

2. 電腦有設定固定時間備份,可以用回溯的方式 (鼎益盛提醒您,這個方式回溯作業系統為主,前提是您所有的硬碟都有在固定備份範圍內)

參考文章:如何移除Crypt0L0cker

3. 如果你是CrypBoss Ransomware,HydraCrypt與UmbreCrypt這三種勒索軟體,可以有未加密,必須要有<加密文件>和<未加密版本>或<加密PNG文件>和<任何PNG圖像>,可以比對出你檔案被加密的運算排序,但是勒索軟體實在太多,變種太快,他們也不保證一定會解開。鼎益盛提醒您Crypt0L0cker則會啟動他的報復機制,不斷重覆加密不建議嚐試。

勒索軟體HydraCrypt和UmbreCrypt解密程式下載

Just drag and drop either an encrypted file and its unencrypted version or an encrypted PNG file and any PNG image onto the decrypter.

勒索軟體解密成功之後你會得到加密金鑰的序號組合,但是怎麼利用這組序號來解開其他檔案,還必須請教有技術的相關人士,一般重灌軟體的磁碟救援電腦商大部分都無法處理

The message you receive after the decrypter determined the correct key for your system.

 

勒索軟體駭客集團針對台灣發動強烈攻擊

雖然你看到的是簡體網站,並不是大陸人創造的,況且大陸沒有便利店能買比特幣,另外支援的還有英文、西班牙文、德文、日文、韓文、泰文。他是根據你的作業系統語言自動切換的,外國人基本上不在乎正體簡體,而馬來西亞,新加坡也用簡體,他們只是選擇最多人使用的。

從網站的付款訊息指示你台灣比特幣廠商,連OK,全家,7-11能買比特幣都標示出來,也讓人不免懷疑台灣有當地的共謀犯罪,電腦重灌的廠商說個人用戶很少人會付錢,付錢之後救援失敗的更是不在少數,更有不少犯罪集團也模仿這個手法,但其實根本沒有金鑰給你也沒真正加密,只是弄個恐嚇的網頁show他的轉帳帳號,改檔名修復一下就能正常開啟。

解開.encrypted檔案的方式及encrypted解密金鑰的流程注意事項

請注意!要避開操作encrypted的地雷才能把解密的損失降到最低

你接下來都必須和時間賽跑,你會產生錯覺以為自己在拍不可能的任務,這是正常的,只要是開機狀態,病毒就會持續運作,必須快狠準的執行,避免以下動作啟動二次加密,才能把損失降到最低,請注意以下幾點:

1. 就算沒有網路依然會繼續加密,會中毒的不只c槽,只要是有網路線連接的都會感染,例如如果有三顆獨立硬碟或是網路芳鄰都會如蝗蟲過境,無一倖免,若有安裝Dorbox PC版,他也會自動上傳致網路空間

2.先從最滿的硬碟開始救,因為他會持續不間斷的加密encrypted,每加密一次encrypted就會增加空間,幾百G很快就滿了,如果等到磁碟完全滿了出現空間不足的話,連解密程式也用,他也會強制不讓你刪除檔案,整個硬碟會出現無法刪除,無法讀取,無法複製的狀態,只能試試移動加密檔案到其他較空的硬碟,但滿的那顆檔案空間不會因此減少

3.如果你想救檔案,在解密之前千萬不要刪除他的檔案(H_E_L_P..警告的網頁檔),那會啟動他第二次加密,即便拿到encrypted解密程式也沒用

4.如果你還想要試著解encrypted檔案,先不要安裝防毒軟體,一樣會啟動他第二次加密,即便拿到encrypted解密程式也沒用

5.拿到encrypted解密金鑰之後,他會開始解開你的檔案還原成正常的檔案,你必須同時把檔案搬到外接硬碟去,或是馬上改附檔名例如把 < 時程計劃表.doc >改成 < 時程計劃表.dddddoc>之類的,以防他又突然發動第二次攻擊  

以下是會被加密的檔名*.odt, *.ods, *.odp, *.odm, *.odc, *.odb, *.doc, *.docx, *.docm, *.wps, *.xls, *.xlsx, *.xlsm, *.xlsb, *.xlk, *.ppt, *.pptx, *.pptm, *.mdb, *.accdb, *.pst, *.dwg, *.dxf, *.dxg, *.wpd, *.rtf, *.wb2, *.mdf, *.dbf, *.psd, *.pdd, *.pdf, *.eps, *.ai, *.indd, *.cdr, *.jpg, *.jpe, img_*.jpg, *.dng, *.3fr, *.arw, *.srf, *.sr2, *.bay, *.crw, *.cr2, *.dcr, *.kdc, *.erf, *.mef, *.mrw, *.nef, *.nrw, *.orf, *.raf, *.raw, *.rwl, *.rw2, *.r3d, *.ptx, *.pef, *.srw, *.x3f, *.der, *.cer, *.crt, *.pem, *.pfx, *.p12, *.p7b, *.p7c

6.如果出現 < files are now decrypted . Your PC will be restarted >, 千萬不要重新啟動,也不要把視窗打叉叉關掉,因為只要關掉視窗他就會強制重新開機,重新開機後,警告視窗會變多,你原來解開的檔案會被二次加密成mirco,第一次的encrypted解密程式就無法使用了。

7. 不要理會< files are now decrypted . Your PC will be restarted >視窗,持續的執行encrypted解密,一直到你確定所有encrypted檔案都解開為止,每執行一次encrypted解密檔案程式,時間都不一定,可能20分鐘,可能一小時

8. 檔名encrypted 如果變成mirco檔那就百分之百沒救了

9. 必須在中毒的那台電腦中執行才有效

10.救出檔案之後重灌一定要格式化

11.病毒變種頻率很高,也有可能是不同集團,情況可能不會一模一樣

12.解密金鑰程式是獨一無二的,無法給其他人使用

13.解開的檔案必須在乾淨的電腦重覆掃毒才能流通在網路上

 

安裝輕量級的瀏覽器防毒軟體可以幫您判別哪些是散佈木馬病毒的惡意網站

要避免不小心開病毒網站的情況,你可以選擇安裝瀏覽器防毒軟體,如下圖,這是google 瀏覽器chrome支援趨勢科技外掛的畫面

  encrypted3

 

 

1.啟用之後,瀏覽器的由上角會出現趨勢科技和小紅傘的logo,代表執勤中

  encrypted2

2.然後鼎益盛找了一個線上免費看<模仿遊戲>的網站來測試

  encrypted

 

 

 

 

3.點下紅色播放頻道之後,趨勢科技會跳出視窗告訴您這就是惡意網站

block

 

現在的防毒軟體也能同時支援各種手機版本、平版等等,至少讓您不暴露在危險之中

 

 

Crypt0L0cker

-----------以上是2016年2月的流程記錄--------------------

2016年3月7號新聞 Mac電腦出現首個綁架檔案的惡意程式KeRanger

據《winandmac》等各家科技網站引用《路透》報導指出,Mac電腦首個綁架檔案的惡意程式「KeRanger」於4日出現,若用戶已下載Transmission BitTorrent 2.90版本的話,就有可能中毒。
 
這個病毒的潛伏期3天,《科技新報》表示Mac用戶若在4日被感染,電腦就會在今天連上駭客伺服器,檔案被加密無法使用,KeRanger更會索取贖金1元比特幣,相當於400美元、台幣約1.3萬元,才能拿回檔案。

2016年2月15號新聞  好萊塢醫院被勒索病毒勒索 360萬美金

位於洛杉磯的好萊塢長老會醫療中心的電腦系統在今年二月初遭到駭客入侵後被感染勒索軟件。目前駭客向院方索要9000比特幣來解鎖電腦檔案(相當於約360萬美金)。由於院方要求醫院工作人員及管理人員向外界保密,因此尚不清楚具體的細節。目前該醫院中心已要求當地警方、聯邦調查局及網絡安全公司幫助調查這起事件。

2016年2月18日 後續新聞 醫院院長證實已經支付 17,000 比特幣給勒贖軟體駭客保住醫院資料

院長艾倫斯凡特表示,醫院系統於2月5號開始癱瘓,為了病患權益及維護醫護系統正常運作,付贖金是最快速的方法,而醫院檔案也完全恢復,FBI發言人表示仍和洛杉磯警方持續追查中。

2015年11月28號新聞  雲林古坑鄉公所80部電腦受害,電腦勒贖總金額逾70萬台幣

〔記者黃淑莉/古坑報導〕電腦「勒索病毒」肆虐,連古坑鄉公所也遭入侵綁架,八十部電腦中常用的文字及影像、照片檔都遭加密,對方要求每部支付三百美金贖金,總額逾台幣七十萬元,公所束手無策。

古坑鄉公所多位同仁這幾天打開電腦螢幕視窗都出現「請注意!我們將使用病毒Cryptolocker為您的所有文檔加密……您的文檔還原的唯一方法—付款給我們」,公所行政室主任林展翔表示,公所的電腦遭勒索病毒入侵,電腦內常用的office文件檔及照片、影音檔都被加密無法開啟。 林展翔指出,公所共有八十六部電腦,中毒達八十部,幸好勒索病毒主要是攻擊word、pdf等office文件檔,並不會攻擊雲端公文系統及其他公文檔,因此並不影響公文往來,不過許多同仁存在電腦裡文件檔及照片檔都報銷。

公所雖立即報警,但破案機會渺茫。林展翔說,中毒第一時間已請資訊公司工程人員協助掃毒,已移除勒索病毒,並請同仁刪掉所有中毒檔案及關閉outlook之郵件預覽功能。

參考資料 :

Chimera 加密勒索軟體威脅 :「要被駭還是一起駭人賺黑心錢 ? 

勒索事業會走向B2B嗎?勒索軟體提供在家創業服務,收取客戶10%費用!

文章標籤

AJlin-DES鼎益盛 發表在 痞客邦 PIXNET 留言(0) 人氣()


只要在這個資料夾

C:\Windows\System32

ctfmon.exe檔點兩下即可!!

打完收工!so easy!!!

 

文章標籤

AJlin-DES鼎益盛 發表在 痞客邦 PIXNET 留言(0) 人氣()

國外的主機通常文章或回復的時間都會不對

但是因為是免費的別人的主機所以沒辦法改PHP.INI檔案

找了網路對我來說最方便的方法就是在我根目錄下面的\

.htaccess 檔案加上這一行就解決了所有目錄下的時區問題

php_value date.timezone Asia/Taipei

===================

.htaccess
.htaccess 可放在任何一網頁目錄內,當該目錄在 httpd.conf 設定不是 AllowOverride None 便可使用 .htaccess 的功能了,而設定作 AllowOverride All 更可使用 .htaccess 的所有功能了
.htaccess 可用作對該目錄及其子目錄進行取存控制,而不用修改 httpd.conf 及不用重新啟動伺服器軟件
——————————————————————————–
httpd.conf 的設定
加上或取消註解 (#) ]定改成 AllowOverride All
然後儲存及重新啟動伺服器軟件
——————————————————————————–
.htaccess 的用法
先把 .htaccess 放在要用的目錄內 (Windows 系統內不可以直接把檔案改名作 .htaccess ,需用間接的方法,如在指令模式下 ren filename.txt .htaccess 或用 FTP 軟件修改該檔名)
用法:
1. 密碼保護
.htaccess 內寫上:
AuthName “testing"
AuthType Basic
AuthUserFile “C:/Apache/htdocs/testing/.htpasswd"
require valid-user
AuthName 是當你進入密碼保護時,瀏覽器出現的說明
AuthUserFile “C:/Apache/htdocs/testing/.htpasswd" 是密碼檔案的位置
密碼檔案 (.htpasswd) 內寫上:
user1:password1
user2:password2
但密碼不應直接寫上,即是如果有一使用者是 test ,密碼是 password ,先用 C:\Apache\bin 內的 htpasswd.exe 把密碼加密,用法如下] require group group1 ,因此只有 group1 的使用者可通過,即 john , peter 及 david

2. 自設錯誤報告文件
.htaccess 內寫上:
ErrorDocument 404 /404.html
如果找不到網頁時,便輸出 404.html 的內容,其他錯誤時做法亦然,如:
ErrorDocument 404 “找不到網頁
ErrorDocument 500 /500.html

3. 自設首頁檔案
.htaccess 內寫上:
DirectoryIndex a.html
首頁檔案便是 a.html 了

4. 禁止讀取檔案
.htaccess 內寫上:

order allow,deny
deny from all

deny from all 即所有人皆不能讀取 sercet.html

而 Apache 1.3 以後的版本,更可以用支援 regular expression 的 filesmatch
.htaccess 內寫上:

order allow,deny
deny from all

即所有人皆不能讀取副檔名為 .jpg 的檔案

.htaccess 內寫上:

order allow,deny
allow form all
deny form 202.202

即 ip 是以 202.202 開頭的不能讀取副檔名為 secret.html 的檔案

.htaccess 內寫上:

order deny,allow
deny from all
allow from 202.202 domain.com

即只允許 ip 是以 202.202 為開頭或域名是 domain.com 的讀取此目錄內的任何內容

.htaccess 內寫上:
AuthUserFile “C:/Apache/htdocs/testing/.htpasswd"

require user peter

即只允許 .htpasswd 內列出的 peter 讀取 sercet.html

5. 重新導向文件
.htaccess 內寫上:
Redirect /old http://url/new
當用戶要求 /old 時,伺服器便把其重新導向至 http://url/new ,或在 .htaccess 內寫上:
Redirect permanent /old http://url/new
當用戶要求 /old 時,伺服器便叫瀏覽器把其永遠重新導向至 http://url/new

6. 防止列出目綠內的檔案
.htaccess 內寫上:
Option -Indexes
這便不能列出檔案目錄了
.htaccess 內寫上:
IndexIgnore *.zip *.txt
這便不列出檔案目錄內的 .zip 與 .txt 檔了

註: .htaccess 的大部分內容 (如:密碼保護) 可以寫回 httpd.conf 相應的目錄設定內( )

- See more at: http://0123456789.tw/?p=64#sthash.mj0HpaKg.dpuf

原文網址 http://0123456789.tw/?p=64

文章標籤

AJlin-DES鼎益盛 發表在 痞客邦 PIXNET 留言(0) 人氣()

joomla Warning: simplexml_load_file() [function.simplexml-load-file]: I/O warning : failed to load external entity

     或是      Warning: simplexml_load_file() [function.simplexml-load-file]​: I/O warning

出現這個報錯訊息的話要排除的項目主要和以下有關

  1.  Apache ,PHP 的設定(發文時間的版本為 Apache 2,PHP 5.5.1,但翻了國外的技術文章之後發現不論甚麼版本都會有此問題發生)        
  2. 內存分配
  3. allow_url_fopen
  4. 加入此段文字至 libxml_disable_entity_loader(false); joomla的  index.php 檔案裡,這只是讓後台錯誤訊息的報錯不出現而已,前台偶爾還是會出現錯誤訊息但是重新整理後又消失

 

我們解決的方法是....升級PHP版本就好了 ˇ__ˇ

 

參考網站 PHP BUGS  

https://bugs.php.net/bug.php?id=64938

國外相同問題文章參考:

http://www.customaffiliatesites.com/warning-simplexml_load_file-function-simplexml-load-file-io-warning-failed-to-load-external-entity/

http://www.joomlashine.com/forum/70-jsn-mico/81437-warning-simplexml-load-file-function-simplexml-load-file-i-o-warning

 

 

 

 

文章標籤

AJlin-DES鼎益盛 發表在 痞客邦 PIXNET 留言(0) 人氣()

skype線上語法,讓瀏覽者能快速找到你與你聯繫

步驟一,聯結以下頁面

http://www.skype.com/en/features/skype-buttons/create-skype-buttons/

步驟二,輸入你自己的skype帳號

勾選 通話 或 聊天 兩種選擇方式

步驟三,複製自動產生的語法

步驟四,貼到部落格 或網站中的自訂欄位,或你自己新增的欄位裡

步驟五,完成。

 

 

文章標籤

AJlin-DES鼎益盛 發表在 痞客邦 PIXNET 留言(1) 人氣()

chorme 無法下載檔案,chorme點選下載後沒反應,要使用迅雷下載能完成下載檔案的動作

這是迅雷更新之後的功能

自動接管了所有下載的執行命令

解決chorme 無法下載檔案的方式

打開迅雷-->高級設定-->取消監視瀏覽器-->chorme便可以正常下載

只要chorme無法下載檔案  

 

鼎益盛AJ

文章標籤

AJlin-DES鼎益盛 發表在 痞客邦 PIXNET 留言(0) 人氣()

.htaccess 文件(Hypertext Access file) Apache Web服務器的一個非常強大的配置文件,對於這個文件,Apache有一堆參數可以讓你配置出幾乎隨心所欲的功能。.htaccess 配置文件堅持了Unix的一個文化——使用一個ASCII 的純文本文件來配置你的網站的訪問策略。

這篇文章包括了16個非常有用的小技巧。另外,因為.htaccess 是一個相當強大的配置文件,所以,一個輕微的語法錯誤會造成你整個網站的故障,所以,在你修改或是替換原有的文件時,一定要備份舊的文件,以便出現問題的時候可以方便的恢復。

1. 使用.htaccess 創建自定義的出錯頁面。對於Linux Apache來說這是一項極其簡單的事情。使用下面的.htaccess語法你可以輕鬆的完成這一功能。(把.htaccess放在你的網站根目錄下)

ErrorDocument 401 /error/401.php
ErrorDocument 403 /error/403.php
ErrorDocument 404 /error/404.php
ErrorDocument 500 /error/500.php

2. 設置網站的時區

SetEnv TZ America/Houston

3.阻止IP列表
有些時候,你需要以IP地址的方式阻止一些訪問。無論是對於一個IP地址還是一個網段,這都是一件非常簡單的事情,如下所示:

allow from all
deny from 145.186.14.122
deny from 124.15

Apache對於被拒絕的IP會返回403錯誤。

4. 把一些老的鏈接轉到新的鏈接上——搜索引擎優化SEO

Redirect 301 /d/file.html http://www.htaccesselite.com/r/file.html

5. 為服務器管理員設置電子郵件。

ServerSignature EMail
SetEnv SERVER_ADMIN default@domain.com

6. 使用.htaccess 訪止盜鏈。如果你網站上的一個圖片被別的N多的網站引用了,那麼,這很有可能會導致你服務器的性能下降,使用下面的代碼可以保護某些熱門的鏈接不被過多的引用。

Options +FollowSymlinks
# Protect Hotlinking
RewriteEngine On
RewriteCond %{HTTP_REFERER} !^$
RewriteCond %{HTTP_REFERER} !^http://(www.)?domainname.com/ [nc]
RewriteRule .*.(gif|jpg|png) $ http://domainname.com/img/hotlink_f_o.png [nc]

7. 阻止User Agent 的所有請求

## .htaccess Code :: BEGIN
## Block Bad Bots by user-Agent
SetEnvIfNoCase user-Agent ^FrontPage [NC,OR]
SetEnvIfNoCase user-Agent ^Java.* [NC,OR]
SetEnvIfNoCase user-Agent ^Microsoft.URL [ NC,OR]
SetEnvIfNoCase user-Agent ^MSFrontPage [NC,OR]
SetEnvIfNoCase user-Agent ^Offline.Explorer [NC,OR]
SetEnvIfNoCase user-Agent ^[Ww]eb[Bb]andit [NC,OR]
SetEnvIfNoCase user-Agent ^Zeus [NC]

Order Allow,Deny
Allow from all
Deny from env=bad_bot

## .htaccess Code :: END

8. 把某些特殊的IP地址的請求重定向到別的站點

ErrorDocument 403 http://www.youdomain.com
Order deny,allow
Deny from all
Allow from ip
Allow from ip

9.直接找開文件而不是下載通常,我們打開網上文件的時候總是會出現一個對話框問我們是下載還是直接打開,使用下面的設置就不會出現這個問題了,直接打開

AddType application/octet-stream .pdf
AddType application/octet-stream .zip
AddType application/octet-stream .mov

10. 修改文件類型下面的示例可以讓任何的文件都成為PHP那麼被服務器解釋。比如:myphp, cgiphtml等。

ForceType application/x-httpd-php
SetHandler application/x-httpd-php

11. 阻止存取.htaccess 文件

# secure htaccess file
order allow,deny
deny from all

12. 保護服務器上的文件被存取

# prevent access of a certain file order allow,deny
deny from all

13. 阻止目錄瀏覽

# disable directory browsing
Options All -Indexes

14. 設置默認主頁

# serve alternate default index page
DirectoryIndex about.html

15. 口令認證你可以創建一個文件用於認證。下面是一個示例:

# to protect a file

AuthType Basic
AuthName “Prompt”
AuthUserFile /home/path/.htpasswd
Require valid-user

# password-protect a directory
resides
AuthType basic
AuthName “This directory is protected”
AuthUserFile /home/path/.htpasswd
AuthGroupFile /dev/null
Require valid-user

16. 把舊的域名轉像新的域名

# redirect from old domain to new domain
RewriteEngine On
RewriteRule ^(.*)$ http://www.yourdomain.com/$1 [R=301,L]

文章標籤

AJlin-DES鼎益盛 發表在 痞客邦 PIXNET 留言(0) 人氣()

IE 選擇器Hack

1
2
3
/* IE 6 and below */
* html .selector {}
.suckyie 6 .selector {} /* .suckyie6 can be any unused class */
1
2
/* IE 7 and below */
.selector, {}
1
2
3
4
/* IE 7 */
*:first-child+html .selector {}
.selector, x:-IE 7 {}
*+html .selector {}
/* Everything but IE 6 */
html > body .selector {}
1
2
3
/* Everything but IE 6/7 */
html > /**/ body .selector {}
head ~ /* */ body .selector {}
1
2
3
4
5
/* Everything but IE 6/7/8 */
:root *> .selector {}
body:last-child .selector {}
body:nth-of-type( 1 ) .selector {}
body:first-of-type .selector {}
IE 屬性/值Hack

1
2
3
/* IE 6 */
.selector { _color : blue ; }
.selector { - color : blue ; }
1
2
3
/* IE 6/7 - acts as an !important */
.selector { color : blue !ie; }
/* string after ! can be anything */
1
2
3
4
5
6
7
/* IE 6/7 - any combination of these characters:
! $ & * ( ) = % + @ , . / ` [ ] # ~ ? : < > | */
.selector { ! color : blue ; }
.selector { $ color : blue ; }
.selector { & color : blue ; }
.selector { * color : blue ; }
/* ... */
1
2
3
/* IE 8/9 */
.selector { color : blue \ 0 /; }
/* must go at the END of all rules */
1
2
/* IE 9/10 */
.selector:nth-of-type( 1 n) { color : blue \ 9 ; }
1
2
3
/* IE 6/7/8/9/10 */
.selector { color : blue \ 9 ; }
.selector { color /*\**/ : blue \ 9 ; }
1
2
/* Everything but IE 6 */
.selector { color /**/ : blue ; }
IE Media Query Hack

1
2
/* IE 6/7 */
@media screen \ 9 {}
1
2
/* IE 8 */
@media \ 0 screen {}
1
2
/* IE 9/10, Firefox 3.5+, Opera */
@media screen and (min-resolution: + 72 dpi) {}
1
2
/* IE 10+ */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none ) {}
1
2
/* IE 6/7/8 */
@media \ 0 screen\, screen \ 9 {}
1
2
/* IE 8/9/10 & Opera */
@media screen \ 0 {}
1
2
/* IE 9/10 */
@media screen and ( min-width : 0 \ 0 ) {}
1
2
/* Everything but IE 6/7/8 */
@media screen and ( min-width : 400px ) {}
IE JavaScript Hack

1
2
3
/* IE 6 */
(checkIE = document.createElement( "b" )).innerHTML = "<!--[if IE 6]><i></i><![endif]-->" ;
var isIE = checkIE.getElementsByTagName( "i" ).length == 1;
1
2
3
4
/* IE 7 */
(checkIE = document.createElement( "b" )).innerHTML = "<!--[if IE 7]><i></i><![endif]-->" ;
var isIE = checkIE.getElementsByTagName( "i" ).length == 1;
navigator.appVersion.indexOf( "MSIE 7." )!=-1
1
2
/* IE <= 8 */
var isIE = '\v' == 'v' ;
1
2
3
/* IE 8 */
(checkIE = document.createElement( "b" )).innerHTML = "<!--[if IE 8]><i></i><![endif]-->" ;
var isIE = checkIE.getElementsByTagName( "i" ).length == 1;
1
2
3
/* IE 9 */
(checkIE = document.createElement( "b" )).innerHTML = "<!--[if IE 9]><i></i><![endif]-->" ;
var isIE = checkIE.getElementsByTagName( "i" ).length == 1;
1
2
/* IE 10 */
var isIE = eval( "/*@cc_on!@*/false" ) && document.documentMode === 10;
1
2
/* IE 10 */
var isIE = document.body.style.msTouchAction != undefined;
Firefox 瀏覽器

  選擇器Hack
1
2
/* Firefox 1.5 */
body:empty .selector {}
1
2
/* Firefox 2+ */
.selector, x:-moz-any-link {}
1
2
/* Firefox 3+ */
.selector, x:-moz-any-link; x: default {}
1
2
/* Firefox 3.5+ */
body:not(:-moz-handler-blocked) .selector {}

  媒體查詢Hack
1
2
/* Firefox 3.5+, IE 9/10, Opera */
@media screen and (min-resolution: + 72 dpi) {}
1
2
/* Firefox 3.6+ */
@media screen and (-moz-images-in-menus: 0 ) {}
1
2
/* Firefox 4+ */
@media screen and (min--moz-device-pixel-ratio: 0 ) {}

  JavaScript Hack
1
2
/* Firefox */
var isFF = !!navigator.userAgent.match(/firefox/i);
1
2
/* Firefox 2 - 13 */
var isFF = Boolean(window.globalStorage);
1
2
/* Firefox 2/3 */
var isFF = /a/[-1]== 'a' ;
1
2
/* Firefox 3 */
var isFF = ( function x(){})[-5]== 'x' ;
Chrome 瀏覽器

  選擇器Hack
1
2
/* Chrome 24- and Safari 5- */
::made-up-pseudo-element, .selector {}
  

  媒體查詢Hack
1
2
/* Chrome, Safari 3+ */
@media screen and (-webkit-min-device-pixel-ratio: 0 ) {}
  

  JavaScript Hack
1
2
/* Chrome */
var isChrome = Boolean(window.chrome);
  

Safari 瀏覽器

  選擇器Hack
1
2
3
/* Safari 2/3 */
html[xmlns*= "" ] body:last-child .selector {}
html[xmlns*= "" ]:root .selector {}
1
2
/* Safari 2/3.1, Opera 9.25 */
*|html[xmlns*= "" ] .selector {}
1
2
/* Safari 5- and Chrome 24- */
::made-up-pseudo-element, .selector {}
  

  媒體查詢Hack
1
2
/* Safari 3+, Chrome */
@media screen and (-webkit-min-device-pixel-ratio: 0 ) {}
  

  JavaScript Hack
1
2
/* Safari */
var isSafari = /a/.__proto__== '//' ;
  

Opera 瀏覽器

  選擇器Hack
1
2
/* Opera 9.25, Safari 2/3.1 */
*|html[xmlns*= "" ] .selector {}
1
2
/* Opera 9.27 and below, Safari 2 */
html:first-child .selector {}
1
2
/* Opera 9.5+ */
noindex:-o-prefocus, .selector {}
  

  媒體查詢Hack
1
2
/* Opera 7 */
@media all and ( min-width : 0px ){}
1
2
/* Opera 12- */
@media all and (-webkit-min-device-pixel-ratio: 10000 ), not all and (-webkit-min-device-pixel-ratio: 0 ) {}
1
2
/* Opera, Firefox 3.5+, IE 9/10 */
@media screen and (min-resolution: + 72 dpi) {}
1
2
/* Opera, IE 8/9/10 */
@media screen {}
  

  JavaScript Hack
1
2
/* Opera 9.64- */
var isOpera = /^ function \(/.test([].sort);
1
2
/* Opera 12- */
var isOpera = Boolean(window.opera);

文章標籤

AJlin-DES鼎益盛 發表在 痞客邦 PIXNET 留言(0) 人氣()

各種程式開發手冊大全,各種名詞解釋及定義用法等等

線上有的程式包含以下

Python
jQuery
NodeJS
PHP
Java
Ruby
Javascript
ActionScript
CSS

http://overapi.com/

 

文章標籤

AJlin-DES鼎益盛 發表在 痞客邦 PIXNET 留言(0) 人氣()

Here is a 100px × 100px div with a 30px border:

 
height: 100px;
width: 100px;
border: 30px solid #999;
 

Watch what happens when each border has a different colour:

 
height: 100px;
width: 100px;
border-top: 30px solid #C66;
border-bottom: 30px solid #6C6;
border-left: 30px solid #66C;
border-right: 30px solid #CC6;
 

Now if we drop the setting of height and explicitly set the width of the div to be 0, we get the following:

 
width: 0;
border-top: 30px solid #C66;
border-bottom: 30px solid #6C6;
border-left: 30px solid #66C;
border-right: 30px solid #CC6;
 

Drop the top border and make the left and right borders transparent and you get this:

 
width: 0;
border-bottom: 30px solid #6C6;
border-left: 30px solid transparent;
border-right: 30px solid transparent;
 

The side borders don’t have to be the same size as the bottom border. Here’s 30px bottom with 52px sides:

 
width: 0;
border-bottom: 30px solid #6C6;
border-left: 52px solid transparent;
border-right: 52px solid transparent;
 

And here’s a div with a top border instead of a bottom border:

 
width: 0;
border-top: 30px solid #6C6;
border-left: 52px solid transparent;
border-right: 52px solid transparent;
 

Put a 104px × 60px div with a background colour between them and you get:

 
width: 0;
border-bottom: 30px solid #6C6;
border-left: 52px solid transparent;
border-right: 52px solid transparent;

width: 104px;
height: 60px;
background-color: #6C6;

width: 0;
border-top: 30px solid #6C6;
border-left: 52px solid transparent;
border-right: 52px solid transparent;

 

And that’s how we get a hexagon in CSS. The 30:52 ratio in the border widths is approximately 1:√3 which is ratio required for a hexagon.

A similar approach can be used to get a hexagon rotated 30°. We just flip around some of the directions, use float: left and drop the explict setting of width to 0.

 
float: left;
border-right: 30px solid #6C6;
border-top: 52px solid transparent;
border-bottom: 52px solid transparent;

float: left;
width: 60px;
height: 104px;
background-color: #6C6;

float: left;
border-left: 30px solid #6C6;
border-top: 52px solid transparent;
border-bottom: 52px solid transparent;
 

Both orientations of hexagons can easily be tiled. The first orientation involves a margin-bottom of -26px and margin-left of 3pxon each hexagon and a margin-left of 53px on even rows:

 
.hex {
    float: left;
    margin-left: 3px;
    margin-bottom: -26px;
}
.hex .top {
    width: 0;
    border-bottom: 30px solid #6C6;
    border-left: 52px solid transparent;
    border-right: 52px solid transparent;
}
.hex .middle {
    width: 104px;
    height: 60px;
    background: #6C6;
}
.hex .bottom {
    width: 0;
    border-top: 30px solid #6C6;
    border-left: 52px solid transparent;
    border-right: 52px solid transparent;
}
.hex-row {
    clear: left;
}
.hex-row.even {
    margin-left: 53px;
}
 

The second orientation involves a margin-right of -26px and margin-bottom of -50px on each hexagon as well as a margin-top: 53px on even columns:

 
.hex {
    float: left;
    margin-right: -26px;
    margin-bottom: -50px;
}
.hex .left {
    float: left;
    width: 0;
    border-right: 30px solid #6C6;
    border-top: 52px solid transparent;
    border-bottom: 52px solid transparent;
}
.hex .middle {
    float: left;
    width: 60px;
    height: 104px;
    background: #6C6;
}
.hex .right {
    float: left;
    width: 0;
    border-left: 30px solid #6C6;
    border-top: 52px solid transparent;
    border-bottom: 52px solid transparent;
}
.hex-row {
    clear: left;
}
.hex.even {
    margin-top: 53px;
}
 

And to finish things off, here’s a quick demo of a CSS 3D perspective transform applied to the hex grid:

 
-webkit-transform: perspective(600px) rotateX(60deg);
-moz-transform: perspective(600px) rotateX(60deg);
-ms-transform: perspective(600px) rotateX(60deg);
-o-transform: perspective(600px) rotateX(60deg);
transform: perspective(600px) rotateX(60deg);
 

Addendum

Will Hardy suggested on Twitter the following use of :before and :after to reduce the necessary divs to one:

 
.hex:before {
    content: " ";
    width: 0; height: 0;
    border-bottom: 30px solid #6C6;
    border-left: 52px solid transparent;
    border-right: 52px solid transparent;
    position: absolute;
    top: -30px;
}

.hex {
    margin-top: 30px;
    width: 104px;
    height: 60px;
    background-color: #6C6;
    position: relative;
}

.hex:after {
    content: "";
    width: 0;
    position: absolute;
    bottom: -30px;
    border-top: 30px solid #6C6;
    border-left: 52px solid transparent;
    border-right: 52px solid transparent;
}
 

jawns pointed out on Hacker News that there's a Unicode code point U+2B22:

文章標籤

AJlin-DES鼎益盛 發表在 痞客邦 PIXNET 留言(0) 人氣()

em指的是什麼?

em指字體高,任意瀏覽器的默認字體高都是16px。所以未經調整的瀏覽器都符合: 1em=16px。那麼12px=0.75em, 10px=0.625em。為了簡化font-size的換算,需要在css中的body選擇器中聲明Font-size=62.5%,這就使em值變為16px*62.5%=10px, 這樣12px=1.2em, 10px=1em, 也就是說只需要將你的原來的px數值除以10,然後換上em作為單位就行了。

em有如下特點:

1. em的值並不是固定的;

2. em會繼承父級元素的字體大小。

國內大大小小的都使用12px作為網站的主要字體大小。10px太小,眼睛很容易疲勞,14px雖容易看清,卻破壞頁面的美感。唯獨12px在審美和視力方面都恰到好處。

文章標籤

AJlin-DES鼎益盛 發表在 痞客邦 PIXNET 留言(0) 人氣()

簡介內容超出部分文字隱藏省略的語法特效

 

點我下載

文章標籤

AJlin-DES鼎益盛 發表在 痞客邦 PIXNET 留言(0) 人氣()

CSS3線上開發預覽網站

1.  CSS3 Pie

 

 
 

 
 

 

4.  Cascader

 

 
 

 

6.  Button Maker

 

 

 

 

8.  Modernizr

 

 

 

 

 

 

9.  HTML5 & CSS3 Support

 

 

 

 

 

 

10.  CSS3 Gradient Generator

 

 

 

 

 

 

11.  CSS3 Please

 

 

 

 

 

 

12.  CSS3 Cheat Sheet

 

 

 

 

 

 

13.  Ultimate CSS Gradient Generator

 

文章標籤

AJlin-DES鼎益盛 發表在 痞客邦 PIXNET 留言(0) 人氣()

你們中有許多人可能已經聽到過有關CSS3的不少傳言,但是我們現在能真正用到的CSS3技巧又有哪些呢?本文,我將向你展示一些與眾不同的CSS3技巧,這些技巧在一些主要的流覽器中表現良好(如FirefoxChromeSafariOpera流覽器)。這些效果會在不支持的流覽器中降級渲染(如IE流覽器)。使用流覽器特定的聲明,許多提議的CSS3樣式都可以馬上拿來使用。

如果你不知道流覽器的特定聲明是什麼,你只需要記住它們都是CSS樣式屬性前與內核提供商有關的特定首碼。因為CSS3目前還沒得到全面的支援,所以我們需要使用這些特定聲明。具體的形式如下:

Mozilla/Firefox/Gecko流覽器的首碼: -moz-
Webkit (Safari/Chrome)流覽器的首碼: -webkit- (注意:一些Wbkit的首碼只能在Safari下使用,Chrome不支援。)
你可能已經看到了,使用這些聲明的有一個缺點,那就是如果我們想在FirefoxSafariChrome中都得到CSS3的效果,我們需要使用到上面所有這些首碼。也不用驚訝,IE流覽器不支持CSS3,因此也就不像其他主要流覽器有一個特定的首碼聲明。

好了,我們已經講的夠多了,我們馬上嘗試一下。注意:樣式聲明去掉這些首碼就是W3標準的實際規範提議。

關於這個頁面的Demo(實例)說明
所有這些例子都是在這個頁面裡面,如果你不能正常查看實例的效果(或者只能查看部分),那說明你正在使用的流覽器並不支持這些CSS3效果

陰影效果
陰影效果接受多個參數值。第一個是陰影的顏色,它還接受另外四個長度(lenght)值,前兩的長度值分辨是X(水準)偏移量和Y(垂直)偏移量。接下一個參數是反映模糊度的數值。第四也是最後一個值是用來定義模糊的散佈程度。

box-shadow: #333 3px 3px 4px;
-moz-box-shadow: #333 3px 3px 4px;
-webkit-box-shadow: #333 3px 3px 4px;

漸變效果
CSS3的漸變樣式剛開始很容易讓人混淆,尤其-moz -webkit的漸變之間還存在不同。在-moz中,你首先需要定義漸變的方向,然後定義起始和終止的顏色。而-webkit的漸變則稍稍複雜一些,首先你需要定義漸變的類型,然後接下來兩個值定義方向,最後兩個值定義了漸變的起始顏色和終止顏色。

-moz-linear-gradient(-90deg,#1aa6de,#022147);
-webkit-gradient(linear, left top, left bottom, from(#1aa6de), to(#022147));

RGBA顏色模式
RGBA的顏色定義實際用起來沒有給人的感覺那麼複雜,它接受四個參數值,以此是:紅色值,綠色值,藍色值,以及透明度。我們不用hex#16進制值的顏色,我們以RGB的模式來設置顏色,其中,透明度可以設置顏色的透明效果。透明度的取值範圍在01之間,0是完全不透明,1是顏色完全透明。下面這些演示例子的透明度都是0.5,元素的透明度是50%rgba不需要附加任何特定的流覽器首碼聲明。

background-color: rgba(0, 54, 105, .5);

HSL色彩模式(色調H,飽和度S ,亮度L
除了RGBACSS3也支援HSL顏色模式。這給我們在顏色和色調的選擇上提供了充足的餘地。在HSL這種色彩模式中的H代表色調,S代表色度,L代表亮度。色調是色盤上角度值  ,而保飽和度和亮度則是顏色的百分比值。
 
background-color: hsl(209,41.2%, 20.6%);

邊框顏色
要使用這一CSS樣式,你需要分別定義border-top, border-right, border-bottom, border-left 才能獲得下面的效果。你注意到定義一個8圖元的邊框,然後邊框又定義了8種不同的顏色。這因為邊框的顏色數量必須與邊框的圖元寬度值相對應。

border: 8px solid #000;
-moz-border-bottom-colors: #555 #666 #777 #888 #999 #aaa #bbb #ccc;
-moz-border-top-colors: #555 #666 #777 #888 #999 #aaa #bbb #ccc;
-moz-border-left-colors: #555 #666 #777 #888 #999 #aaa #bbb #ccc;
-moz-border-right-colors: #555 #666 #777 #888 #999 #aaa #bbb #ccc;
 
文本選擇顏色設置
我不得不要說文本選擇顏色的定義是一個相當激動人心的新功能。當我第一次在CSS技巧上看到這個是,我在覺得它非常貼心。有了::selection這對偽物件(pseudo-element),你可以在使用者選一段文本元素時改變顏色和背景。如果你問的看法,我會覺得這非常漂亮。雖然::selection已經從目前的CSS3草案中移除鳥,但是我們希望稍後它在添加進來。
 
::selection {background: #3C0; /* Safari */color: #90C;}::-moz-selection {background: #3C0; /* Firefox */color: #90C;}


變形
有了變形樣式,你可以讓元素的外觀在滑鼠懸停時變大。給Scale(比例)值設置一個大於1的數值,元素就會便打。反過來或,如果值小於1,元素的大小就會縮小。除了Scale比例,它還有其他許多不同的變形方式可用。你可以訪問Firefox的開發者頁面,查看它們所能實現的效果

-moz-transform: scale(1.15);-webkit-transform: scale(1.15);

多欄佈局
有了這個新的多欄佈局樣式,你可以給文本呈現類似”報紙“排版的效果。跟在CSS2中的實現方法相比,CSS3中,我們實現這類效果要簡單的多。下面,我指定鳥所需要的列數量,以及分離的規則類型,欄與欄之間的空隙有多大。用起來很簡單是吧
 
-moz-column-count:3;-moz-column-rule: solid 1px black;-moz-column-gap: 20px;

總結
我希望跟我一樣,對CSS3的這些特性感到激動。他給網頁設計師和開發者更多的力量,並且讓許多方面都簡化不少。現在,我們只需等待所有流覽器支持它。當然,我這裡演示的知識CSS3新功能的冰山一角。如果你想瞭解更多資訊,技巧和説明,我建議你訪問下面這些網站學習。

文章標籤

AJlin-DES鼎益盛 發表在 痞客邦 PIXNET 留言(0) 人氣()

1 2
找更多相關文章與討論