December 11, 2014
在CSS中指定
<head>
<style type="text/css">

input.example, select {
width: 300px;
}
textarea {
width: 300px;
height: 7em;
}

input:focus, select:focus, textarea:focus {
background-color: #bde9ba;
}

</style>
</head>


在HTML中自動會呈現改變的顏色 (註:<p>無相關)
<form method="post" action="目標URL">

<p><input type="text" name="name" size="40" class="example"></p>

<p><select name="select">
<option value="選擇1">選擇1</option>
<option value="選擇2">選擇2</option>
<option value="選擇3">選擇3</option>
</select></p>

<p><textarea name="msg" cols="40" rows="7"></textarea></p>

<p><input type="submit" value="送信"></p>

</form>


文章來源:
http://www.tagindex.com/stylesheet/form/background_color.html
December 3, 2014
固定在上方的寫法

<html>
<head>

<style type='text/css'>
#bTop{ position:fixed; top:0px;}
</style>

</head>
<body>

<div id="bTop">
這裡是 bTop !!!
</div>

</body>
</html>

備註:上方會有少了與#bHeader 相同空間。

April 10, 2014
December 14, 2013
html, body, div, span,    
h1, h2, h3, h4, h5, h6, p, blockquote, pre,    
a, abbr, acronym, address, big, cite, code,    
img, ins, kbd, q, s, samp,    
small, strike, strong,    
dl, dt, dd, ol, ul, li,    
fieldset, form, label, legend,

table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;    
    padding: 0;    
    border: 0;    
    outline: 0;    
    font-size: 100%;    
    vertical-align: baselinebaseline;    
    background: transparent;    
    }
January 15, 2013
點擊在新視窗中瀏覽此圖片

CSS3中似乎只有一個寫法是不對應所有瀏覽器的...
已下為參考寫法...

.test {
width: 300px;
height: 1.4em;
text-overflow: ellipsis; /* Safari 用 */
-o-text-overflow: ellipsis; /* Opera 用 */
overflow: hidden;
white-space: nowrap; /* 文字不折行功能。一定要寫入,否則不會出現效果 */
border: 1px solid #666666;
}
.test:hover {
text-overflow: inherit; /* Safari 用 */
-o-text-overflow: inherit; /* Opera 用 */
overflow: visible;
}


HTML BODY中寫入
<div class="test"> 如果你要呈現過長的文章,請用滑鼠確認一下喔 </div>


sample:
http://blog.apao.idv.tw/sample/CSS3/text-overflow.html

參考:
http://blog.flugel.biz/2009/07/css3-text-overflow.html
http://www.w3schools.com/cssref/pr_text_white-space.asp
September 27, 2010
點擊在新視窗中瀏覽此圖片

在瀏覽器上可以馬上改,馬上看到結果的編輯器,好像只對應Google Chrome。動畫如下,可以參考如何修改。



Stylebot Download (Chrome only)
https://chrome.google.com/extensions/detail/oiaejidbmkiecgbjeifoejpgmdaleoha
分頁: 4/5 第一頁 上頁 1 2 3 4 5 下頁 最後頁
[ 顯示模式: 摘要 | 清單 ]