/**
* https://vector.cool
*/
<style>
div{
height:240px;
overflow:hidden;
overflow-y:auto;
-webkit-overflow-scrolling: touch;
}
</style>[……]
純 CSS 垂直及水平置中 – 超簡單一段搞定
在被垂直居中元素的父類別，加這一段就可以，非常簡單
HTML
CSS
檢視結果
See the Pen Vertical and horizontal center by VECTOR.cool 威得數位
(@ann71727) on CodePen.
CSS 達成 Div 垂直置中的方法研究 (CSS Vertical Centering Complete Guide)
[……]
HTML5 a Tag 直接用手機撥電話的連結
在 a 標籤中 href 屬性中，開頭加上 tel:撥打的電話號碼 ，在手機上按下此連結會呼叫手機撥號的應用程式，並把電話輸入在電話欄中，非常方便，但要注意電話號碼格式，只能輸入數字
錯誤：02-2888-8888
正確：0228888888
<a href="tel:0228888888">聯絡我們</a>
[……]
HTML5 a 標籤強制下載檔案
當a 標籤直接指向檔案時，會由瀏覽器去決定開啟方式，”給敖”的去決定下載還是開啟檔案，例如PDF，瀏覽器通常會直接開啟檔案，但有些檔案，希望User可以直接下載，在HTML5中有新的方式可以指定用下載的方式，範例於下方程式碼：
- path_to_file 是絕對路徑或者相對路徑 。
- file_name 下載檔案的預設名稱。
http://hant.ask.helplib.com/javascript/post_406301
https://stackoverflow.com/questions/11620698/how-to-trigger-a-file-download-when-clicking-an-html-button-or-javascript
[……]
PHP 呼叫 Namespace 文件中的 function
呼叫 Namespace 文件裡的 function
/**
* https://vector.cool
*/
Namespace VECTOR\COOL;
function test() {
echo "Hello world!\n";
}
VECTOR\COOL\test();呼叫 Namespace 文件裡 class 中的 function
/**
* https://vector.cool
*/
namespace VECTOR\COOL;
class HELLO{
static public function test() {
echo "Hello world!\n";
}
}
VECTOR\COOL\HELLO::test();在 WordPress Action 中呼叫
<?php
/**
* https://vector.cool
*/
Namespace VECTOR\COOL;
function test() {
echo "Hello world!\n";
}
add_action('init','VECTOR\COOL\test');參考資料：
http://php.net/manual/en/language.namespaces.nsconstants.php[……]
PHP Namespace 錯誤 Warning call_user_func_array() expects parameter 1 to be a valid callback
使用 __NAMESPACE__ 取得當前文件的 Namespace
呼叫 Namespace 裡的 function
/**
* https://vector.cool
*/
Namespace VECTOR\COOL;
function test() {
echo "Hello world!\n";
}
call_user_func(__NAMESPACE__ .'\test');呼叫 Namespace 裡的 class 中的 function
/**
* https://vector.cool
*/
Namespace VECTOR\COOL;
class Hello {
static public function test() {
echo "Hello world!\n";
}
}
call_user_func(__NAMESPACE__ .'\Hello::test'); // String
call_user_func(array(__NAMESPACE__ .'\Hello', 'test')); // Array在 WordPress Action 中呼叫
/**
* https://vector.cool
*/
Namespace V123\PLUGIN\CFU;
add_action('init',__NAMESPACE__.'\create_initial_admin_menu');參考資料：
http://php.net/manual/en/language.namespaces.nsconstants.php
https://stackoverflow.com/questions/14682356/relative-namespaces-and-call-user-func[……]
CSS3 灰階
.gray {
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
filter: grayscale(100%);
filter: gray;
}[……]
CSS3 鏡射
<style>
/* 水平鏡射 */
.flipx {
-moz-transform:scaleX(-1);
-webkit-transform:scaleX(-1);
-o-transform:scaleX(-1);
transform:scaleX(-1);
filter:FlipH;
}
/* 垂直鏡射 */
.flipy {
-moz-transform:scaleY(-1);
-webkit-transform:scaleY(-1);
-o-transform:scaleY(-1);
transform:scaleY(-1);
filter:FlipV;
}
</style>[……]
html IE
tag 出現詭異方框
客戶反映在IE結尾都有奇怪的框框，原來還有人在用IE阿？
好吧！想辦法解決
原本以為這是邊框，所以天真的想說CSS加個 border:none 就解了，果然是我太天真，完全沒動！！
Google 一下，這似乎跟網路字型的Bug有關，使用下方的 CSS 就解囉
/* https://vector.cool */
/* 消除 IE <br> 的詭異框框 */
br {
font-family: unset !important;
font: unset !important;
}
下圖，詭異的框框都不見了。
[……]
超簡單取得微信 WeChat QR Code
取得微信 WeChat QR Code
開啟微信 WeChat APP
按右下角「我的設定」。
接著，我的設定頁面右上角按 QRCode icon
這時會出現你的 QRCode，按一下右上角的三個點開啟選項。
按下「儲存到手機」按紐。
QRCode 圖片就會存到手機相簿中。
打開手機相簿，就可以看到剛剛匯出的 QRCode
可以透過手機分享功能，分享自己的 QRCode
[……]