2012年10月9日 星期二

利用 RabbitVCS clone/update bitbucket 上的 git 專案


如果直接用 bitbucket 提供的
https://[username]@bitbucket.org/XXXX/XXXX.git
會顯示 Could not read Password for XXXX 的訊息
要將 url 改成
https://[username]:[password]@bitbucket.org/XXXX/XXXX.git
才行
如果是已經 clone 出來的 project, 則修改 .git/config 裡的 url 內容即可

git 設定

使用 git config --system 的設定值會存在 /etc/gitconfig 裡
使用 git config --global 的設定值會存在 ~/.gitconfig 裡
每個 repository 裡的 .git/config 則會覆蓋上述二個檔案的設定,提供個別 repository 專門的設定

將預設編輯器改為 vim
git config --global core.editor vim
改使用者名稱
git config --global user.name "Your Name"
改使用者 e-mail 位址
git config --global user.email you@example.com
設定使用的 diff tool
git config --global merge.tool vimdiff
查看目前設定
git config --lis

2012年10月5日 星期五

[CSS] 製作自訂邊框的做法

參考: Transparent custom corners and borders, version 2

1. 製作一張含四個角的邊框圖,其中寬要設大一點,防止頁面被放大時邊框會破掉
2. 製作一張直線邊框的圖,不用太大,如果左右邊框不一樣的話就要做二張
3. html 的內容:
    <div class="cb">
        <div class="bt"> <!-- 上邊框線乃右圓角 -->
            <div></div> <!-- 左圓角 -->
        </div>
        <div class="i1"> <!-- 左邊框線 -->
        <div class="i2"> <!-- 右邊框線 -->
        <div class="i3"> <!-- 底色 -->
        <h1>Header</h1>
        <p>TEST</p>
        </div>
        </div>
        </div>
        <div class="bb"> <!-- 下方框線及右圓角 -->
            <div></div> <!-- 左圓角 -->
        </div>
    </div>
4. css 的內容:
/* Normal styling */
.cb {margin:0.5em 0;}
    /* Top corners and border */
.bt {
    height:17px;
    margin:0 0 0 18px;  /* 設定左邊界,將空間留給顯示左上邊角的 div */
    background:url(box.png) no-repeat 100% 0;  /* 將圖靠右上對齊,顯示上方框線及右上方的邊角 */
}
.bt div {
    position:relative;
    left:-18px;  /* 原本 bt 設定了左邊界,這裡要設負值讓 div 移回原本的位置 */
    width:18px;  /* 設定邊角的寬度,避免蓋掉右上邊角 */
    height:17px;
    background:url(box.png) no-repeat 0 0; /* 將圖靠左上對齊,顯示左上方的邊角 */
    font-size:0;
    line-height:0;
}
    /* Bottom corners and border */
.bb {
    height:14px;
    margin:0 0 0 12px;  /* 設定左邊界,將空間留給顯示左下邊角的 div */
    background:url(box.png) no-repeat 100% 100%; /* 將圖靠右下對齊,顯示右下方的邊角 */
}
.bb div {
    position:relative;
    left:-12px;   /* 原本 bb 設定了左邊界,這裡要設負值讓 div 移回原本的位置 */
    width:12px;  /* 設定邊角的寬度,避免蓋掉右下邊角 */
    height:14px;
    background:url(box.png) no-repeat 0 100%; /* 將圖靠左下對齊,顯示左下方的邊角 */
    font-size:0;
    line-height:0;
}
    /* Left border */
.i1 {
    padding:0 0 0 12px;  /* 設定左邊界,避免內容和邊框重疊 */
    background:url(borders.png) repeat-y 0 0;
}
    /* Right border */
.i2 {
    padding:0 12px 0 0;   /* 設定右邊界,避免內容和邊框重疊 */
    background:url(borders.png) repeat-y 100% 0;
}
    /* Wrapper for the content. Use it to set the background colour and insert some padding between the borders and the content. */
.i3 {
    display:block;
    margin:0;
    padding:1px 10px;
    background:#fff;
}
    /* Make the content wrapper auto clearing so it will contain floats (see http://positioniseverything.net/easyclearing.html). */
.i3:after {
    content:".";
    display:block;
    height:0;
    clear:both;
    visibility:hidden;
}
.i3 {display:inline-block;}
.i3 {display:block;}