-1 
.button1{


  background: #E68A00 url(wooden.jpg) repeat-x;
  border: 2px solid #eee;
  height: 28px;
  width: 115px;
  margin: 50px 0 0 50px;
  padding: 0 0 0 7px;
  overflow: hidden;
  display: block;
  text-decoration:none;
  font-family: 'Sacramento', cursive;
  color : white;
  font-size: 30px;




  /*Rounded Corners*/
-webkit-border-radius: 15px;
-moz-border-radius: 15px;
border-radius: 15px;

/*Gradient*/
background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
background-image: -ms-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
background-image: linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));

/*Transition*/
-webkit-transition: All 0.5s ease;
-moz-transition: All 0.5s ease;
-o-transition: All 0.5s ease;
-ms-transition: All 0.5s ease;
transition: All 0.5s ease;


}

pg.button1{ 
position:absolute;
right:0px;
top:100px;

}

pg:hover {
  width: 200px;
}






<pg <a class = "button1" href="http://www.google.com">Small $14 </a>  </pg>## Heading ##

上記のタグは、リンクを画面に配置するためのタグ pg を導入するまではリンクでした。その理由は、クラスを他のオブジェクトと一緒に使用したいからです! コードを複製する必要はありません。同じクラスで使用するために p1 p2 p3 p4 のようなタグを作成しました実際には配置しますが、リンクではなくなりました! 何故ですか ？どうすればこれを再び機能させることができますか？

4

1 に答える 1

1

新しいタグを発明するのではなく、複数のクラスを使用してください。この場合、実際に何をしようとしているかに応じて、次のことができます。

<a class="button1 pg" href="...">Small $14</a>

またはこれ：

<div class="pg"><a class="button1" href="...">Small $14</a></div>
于 2013-03-17T18:50:24.567 に答える