button input

button input onchange onfocus width height

 HTML button 屬性
 disabled : 不能夠動作的按鈕，僅能看不能按。
 name     : 按鈕的名稱 。
 type     : 按鈕的類型  button單純按鈕/reset清空表單/submit送出表單。
 value    : 就是按鈕的値 。
autofocus : 規定當頁面加載時按鈕應當自動地獲得焦點。

HTML button 事件
用來觸發某種 JavaScript 動作，例如 onclick="function ()" 
                                 onclick="{javascript}"

<input onclick="alert('你按動了我')" type="button" value="按我" />

<button class="Bt" type="button">我是按鈕</button>   

<style> 
.Bt { background-color:silver;border: 3px outset #d5d5d5;
        color: black; cursor: pointer; font-size: 20px; width: 150px; height:50px; }
.Bt:active {border: 5px inset #d5d5d5;}
</style> 

<button class="Bt1" type="button">我是按鈕</button>   

<style> .Bt1 { background-color: silver;
 border-radius:50% 50% 50% 50%; border: 3px outset #d5d5d5; color:black;
cursor:pointer; font-size:20px; height:50px; width:150px;}
.Bt1:active {border: 5px inset #d5d5d5;}
</style>

<button class="Bt1" type="button">我是按鈕</button>   

<button class="Bt1" type="button"><marquee scrollamount="5" width="40">&lt;&lt;&lt;</marquee>按我 <marquee scrollamount="5" direction="right" width="40">&gt;&gt;&gt;</marquee></button> 

<button class="Bimg" type="button"></button>

<style>
.Bimg{
    background:url( https://XXX.jpg ) no-repeat;
    cursor:pointer;
    -moz-background-size: contain; 
    -o-background-size: contain; 
    -webkit-background-size: contain;
    background-position: center;      
    background-repeat: no-repeat;    
    border: 5px outset #d5d5d5;
    background-size: cover;
    height: 150px;width:180px }
.Bimg:active { border: 5px inset #d5d5d5; }
</style>

<button class="Bimg1" value="按我"><marquee scrollamount="40" scrolldelay="600" style="width:120px" >按我</marquee></button>
<style>
.Bimg1 {background-color: silver; 
        border: 3px outset #d5d5d5; 
        color: black; 
        cursor: pointer; 
        font-size: 20px; 
        height: 50px; width: 150px;}
.Bimg:active { border: 5px inset #d5d5d5; }
</style>

#html <button> #html <button> onclick #html <button> autofocus #html <button> type