原创 Retina顯示原理探索

顯示是個大問題,牽扯內容可能沒文章中列出的這麼多,大家酌情閱讀。所謂Retina是一種顯示技術,可以將把更多的像素點壓縮至一塊屏幕裏,從而達到更高的分辨率並提高屏幕顯示的細膩程度,這種分辨率在正常觀看距離下足以使人肉眼無法分辨其中的單獨像素

原创 定製文件上傳按鈕

<div class="u-upload">     <button type="button">上傳文件</button>     <input type="file"/> </div> <span class="u-upload">  

原创 四周不留白列表

<div class="m-demo">     <ul>        <li>             <div class="cnt">                 <div class="img"><a href="#"><im

原创 底部對齊列表

<ul class="m-demo">     <li>this is content</li>     <li><img style="width:50px;height:50px;" src="http://nec.netease.co

原创 Sublime Text 3 支持的熱門插件推薦

Sublime Text 3 支持的熱門插件推薦SublimeText是一款非常精巧的文本編輯器,適合編寫代碼、做筆記、寫文章。它用戶界面十分整潔,功能非同凡響,性能快得出奇。這些非常棒的特性 包括任意跳轉(Goto Anything)、多

原创 移動web開發框架研究

4、百度移動web框架百度移動web框架有三個瞭解了一下。4.1 GMU      GMU(Global Mobile UI)是百度前端通用組開發的移動端組件庫,具有代碼體積小、簡單、易用等特點,組件內部處理了很多移動端的bug,覆蓋機型廣

原创 Sublime Text 2/3 配置文件詳解

Sublime Text 3 是一款具有代碼高亮、語法提示、自動完成且反應快速的編輯器軟件,不僅具有華麗的界面,還支持插件擴展機制,用她來寫代碼,絕對是一種享受。收藏一份 Sublime Text 2/3 Preferences.subli

原创 webkit webApp 開發技術要點總結

1. viewport: 也就是可視區域。對於桌面瀏覽器,我們都很清楚viewport是什麼,就是出去了所有工具欄、狀態欄、滾動條等等之後用於看網頁的區域, 這是真正有效的區域。由於移動設備屏幕寬度不同於傳統web,因此我們需要改變view

原创 Viewport 不權威指南

什麼是 Viewport,爲什麼需要 Viewport:Viewport:視口,視覺窗口,顯示區域。在顯示面積上手機屏幕相對桌面顯示器要小很多,在幾年前(現在也如此)大部分網站都是爲桌面顯示器瀏覽而設計,很少考慮到適應手機屏幕,所以如果用手

原创 國內外各大免費收錄網站搜索引擎及導航網址提交入口

搜索引擎網站收錄地址大全百度搜索網址提交入口口:http://zhanzhang.baidu.com/sitesubmit/index百度死鏈提交入口:http://zhanzhang.baidu.com/badlink/index百度信譽

原创 如何優化移動網站,快速響應如本地應用

注:該文章大約3000字。它覆蓋了移動端網頁交互體驗優化的很多不同方面的實際解決方案,用來優化你的網頁運行速度。注意不是讓你的站點運行的有多快,而是讓你的用戶感覺有多快。 當下在移動端構建一個優秀的網站逐漸變得越來越簡單。無論是響應式設計還

原创 通過分析github代碼庫總結出來的工程師代碼書寫習慣

最佳原則堅持這些原則。無論多少,找出不對的地方。如果你想要爲這個編碼指導做貢獻,請訪問新開一個issue.無論人數多少,代碼都應該同出一門。項目命名項目名全部採用小寫方式, 以中劃線分隔。 比如: my-project-name目錄名目錄名

原创 Sublime Text 3 全套快捷鍵及功能介紹

Sublime text 3 是我最喜歡的代碼編輯器,每天使用,是一款 Code 效率神器。如果掌握基本的代碼編輯器的快捷鍵,能讓你打碼更有效率。結合自己的需求,有選擇的使用、練習、熟悉相關快捷鍵,一兩個星期後定能提高效率!Sublime

原创 深入屏幕像素概念

如果你是一個開始接觸移動Web開發的前端工程師,那麼你或許也遇到了和我曾經遇到的過問題:有太多新的概念需要掌握,太多相似的概念需要區分。沒關係,我將用兩篇文章的篇幅來解決這些問題。上篇文章關於解釋和區分一些入門級別概念。這些概念你或許一直在

原创 移動APP技巧摘錄

/* 去掉input在ios下的默認效果: input{        resize: none;        -webkit-appearance:none;   -webkit-appearance: none; 消除輸入框和按鈕