0

リンク内の画像に苦労しています。最初のリンク (画像付き) をページネーションの他のリンクと同じサイズにする方法がわかりません。それらを揃える方法もわかりませんか？

.content .pagination a {
    text-decoration: none;
    color: #717171;
    border: 1px solid #c0c0c0;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    padding: 3px 8px;
    margin: 0 1px;
    background-color: #fff;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ededed));
    background-image: -webkit-linear-gradient(top, #fff, #ededed);
    background-image: -moz-linear-gradient(top, #fff, #ededed);
    background-image: -ms-linear-gradient(top, #fff, #ededed);
    background-image: -o-linear-gradient(top, #fff, #ededed);
    background-image: linear-gradient(top, #fff, #ededed);
}

.content .pagination a.prev {
    padding: 11px;
    position: relative;
    vertical-align: middle;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAICAYAAADaxo44AAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAB4SURBVHjaYvj//z8DDBcWFqYBcTuIzQgiQKCoqCgNSM1kgAArsASyYEhICIMVEDB/+vTJDMjfiCSYBWSuZ7KxsdGFamd49OjRMiA1HcQGGWV5DAjWrFkDk0/v6+ubBbM8Eyg3DUnSnAHJuSDJ/1u2bAEy/5sBBBgAv6VOHKw5pxYAAAAASUVORK5CYII=) 8px 7px no-repeat;
    border: 1px solid #d9d9d9;
    line-height: 0;
    font-size: 0;
    color: transparent;
}

ここに画像の説明を入力

HTML コード:

<div class="pagination">
                    <a href="#" class="prev">&lsaquo;</a>
                    <a href="#" class="active">1</a></div>
4

2 に答える 2

1

これについて話しているのですか？:

                    <a href="#" class="prev"><img src="path"></a>
                    <a href="#" class="active"><img src="path"></a>



</div>
于 2013-11-09T17:24:57.550 に答える
0

それを取得する簡単な方法は、Unicode 文字を使用することです。

CSS

 .pagination a {
    text-decoration: none;
    color: #717171;
    border: 1px solid #c0c0c0;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    width: 18px;
    padding: 3px 8px;
    margin: 0 1px;
    background-color: #fff;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ededed));
    background-image: -webkit-linear-gradient(top, #fff, #ededed);
    background-image: -moz-linear-gradient(top, #fff, #ededed);
    background-image: -ms-linear-gradient(top, #fff, #ededed);
    background-image: -o-linear-gradient(top, #fff, #ededed);
    background-image: linear-gradient(top, #fff, #ededed);
}


 .pagination a.prev:before {
    content: "\03c";
}

フィドル

このテクニックに興味がある場合は、シェイプキャッチャーが貴重なリソースになる可能性があります

于 2013-11-09T18:03:25.373 に答える