2017-02-22 3 views
0

Ich habe gerade meine erste Website in HTML5 und Javascript erstellt und alle Links arbeiten offline (Doppel-und Dreifachercheck es), aber wenn ich es auf den Host-Server hochgeladen, keine der Links funktionieren. Kann mir jemand Vorschläge machen? Hier ist und Beispiel für meine Link-Tasten:Meine href Link Buttons funktionieren nicht online

<div> 
<center> 
<button style="margin-top:10px;margin-bottom:10px;height:25px;width:100px;font-size:14px"><a href="hoverB.html">Books</a></button> 
</center> 
</div> 
+0

haben aussehen lassen Sie alle setzen die Dateien in Ihrem Stammordner ?? –

+0

Hallo, ja ich tat, alles ist da –

+0

Definieren Sie "nicht arbeiten". Was geschieht? – David

Antwort

3

Sie setzen ein Anker-Tag in einer Schaltfläche. Ich nahm an, dass Sie den Benutzer umleiten möchten, wenn sie auf die Schaltfläche klicken. Sie können etwas tun:

Beispiel 1:

<a href="page.html"><button type="button">Click on me</button></a> 

Beispiel 2: (empfohlen)

<button type="button" onclick="location.href='page.html'">Click on me</button> 

Ich hoffe, dies wird Ihnen helfen!

2

Oder können Sie auch Anker-Tag mit CSS hinzufügen, die es wie ein Knopf

<a href="page.html" class="btn">Click on me</a> 

.btn:active { 
     position: relative; 
    top: 1px; 
    color: #fcd3a5; 
    background: -webkit-gradient(linear, left top, left bottom, from(#f47a20), to(#faa51a)); 
    background: -moz-linear-gradient(top, #f47a20, #faa51a); 
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f47a20', endColorstr='#faa51a'); 
} 

.btn{ 
     display: inline-block; 
    zoom: 1; 
    vertical-align: baseline; 
    margin: 0 2px; 
    outline: none; 
    cursor: pointer; 
    text-align: center; 
    text-decoration: none; 
    font: 14px/100% Arial, Helvetica, sans-serif; 
    padding: .5em 2em .55em; 
    text-shadow: 0 1px 1px rgba(0,0,0,.3); 
    -webkit-border-radius: .5em; 
    -moz-border-radius: .5em; 
    border-radius: .5em; 
    -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2); 
    -moz-box-shadow: 0 1px 2px rgba(0,0,0,.2); 
    box-shadow: 0 1px 2px rgba(0,0,0,.2); 
     color: #fef4e9; 
    border: solid 1px #da7c0c; 
    background: #f78d1d; 
    background: -webkit-gradient(linear, left top, left bottom, from(#faa51a), to(#f47a20)); 
    background: -moz-linear-gradient(top, #faa51a, #f47a20); 
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#faa51a', endColorstr='#f47a20'); 
} 

JSFiddle