0

私を助けてください！私のサイトのメニューは、このウェブサイトのメニューに似ています。

このメニューでは:

width: 30%;
margin-left: -25%;
height: 98%;
background:#ffab23;
position: fixed;
top: 1%;
bottom: 1%;
z-index: 1;
border-radius:15px;

列と多くの行を持つテーブルが含まれており、各行にはボタンがあります。

テーブルをメニューとして自動で増減させる方法。

メニューの一部:

<div id="menu" align="left" style="direction:rtl; overflow:auto;">
<div style="direction:ltr;">
<table height="100" width="80%" align="left">
    <tr>
    <td>
    <a href="#introducere" class="myButton">1. INTRODUCERE</a>
    </td>
    </tr>...

ボタン:

.myButton {
-moz-box-shadow:inset 0px 0px 3px 3px #caefab;
-webkit-box-shadow:inset 0px 0px 3px 3px #caefab;
box-shadow:inset 0px 0px 3px 3px #caefab;
background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #77d42a), color-stop(1, #5cb811) );
background:-moz-linear-gradient( center top, #77d42a 5%, #5cb811 100% );
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#77d42a', endColorstr='#5cb811');
background-color:#77d42a;
-moz-border-radius:6px;
-webkit-border-radius:6px;
border-radius:6px;
border:1px solid #268a16;
display:inline-block;
color:#306108;
font-family:calibri;
font-size:15px;
font-weight:bold;
padding:2% 24px;
text-decoration:none;
text-shadow:2px 2px 2px #aade7c;
width:79%;}


.myButton:hover {
background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #5cb811), color-stop(1, #77d42a) );
background:-moz-linear-gradient( center top, #5cb811 5%, #77d42a 100% );
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#5cb811', endColorstr='#77d42a');
background-color:#5cb811;}


.myButton:active { position:relative; top:1px; }
4

1 に答える 1

0

height:auto高さを自動的に増減させたい場合は を使用し、幅も同じにしたい場合は を使用しますwidth:auto。

テキスト INTRODUCEREのボタンを参照してください。長いテキストを入力すると、自動的に増加します。

于 2013-06-13T06:05:28.517 に答える