Dedecms 목록 페이지 목록의 페이지 넘기기 버튼 스타일을 해결하는 방법

Dedecms 목록 페이지 목록 페이지 넘김 버튼 스타일을 해결하는 방법은 무엇인가요?

Dedecms 목록 페이지 목록 페이지 전환 버튼의 홈페이지 및 마지막 페이지 스타일 솔루션

추천 학습: Dreamweavercms# 🎜🎜#

Dedecms 목록 페이지 넘기기 버튼은 {dede:pagelist listitem="index,end,pre,next,pageno" listsize="10"/}html을 생성한 후 목록 페이지의 첫 번째 페이지는# 🎜🎜#을 사용합니다.

<li >首页</li> 
<li class="thisclass">1</li> 
<li><a href=&#39;news_2.html&#39;>2</a></li> 
<li><a href=&#39;news_3.html&#39;>3</a></li> 
<li><a href=&#39;news_2.html&#39;>下一页</a></li> 
<li><a href=&#39;news_3.html&#39;>末页</a></li>

마지막 페이지는 다음과 같습니다:

<li><a href=&#39;news_1.html&#39;>首页</a></li> 
<li><a href=&#39;news_2.html&#39;>上一页</a></li> 
<li><a href=&#39;news_1.html&#39;>1</a></li> 
<li><a href=&#39;news_2.html&#39;>2</a></li> 
<li class="thisclass">3</li> 
<li >末页</li>

기본 템플릿의 CSS 스타일 시트:

.dede_pages{ 
} 
.dede_pages ul{ 
float:left; 
padding:12px 0px 12px 16px; 
} 
.dede_pages ul li{ 
float:left; 
font-family:Tahoma; 
line-height:17px; 
margin-right:6px; 
border:1px solid #E9E9E9; 
} 
.dede_pages ul li a{ 
float:left; 
padding:2px 4px 2px; 
color:#555; 
display:block; 
} 
.dede_pages ul li a:hover{ 
color:#690; 
text-decoration:none; 
padding:2px 4px 2px; 
} 
.dede_pages ul li.thisclass, 
.dede_pages ul li.thisclass a,.pagebox ul li.thisclass a:hover{ 
background-color:#F8F8F8; 
padding:2px 4px 2px; 
font-weight:bold; 
}

".dede_pages ul li a" 및 " 를 볼 수 있습니다. dede_pages ul li.thisclass"에는 padding:2px 4px 2px; 속성이 있지만 ".dede_pages ul li"에는 없습니다. ".dede_pages ul li"에 padding:2px 4px 2px; 속성이 없으면

홈 페이지

및

마지막 페이지

버튼이 작아요. 이 상황이 얼마나 추악한지 생각해 보세요.

위의 문제에 대한 두 가지 해결 방법은 다음과 같습니다.

첫 번째 방법은 CSS를 통해 해결되는 방법입니다. li에만 스타일을 추가합니다. 코드는 다음과 같습니다.

.dede_pages ul{  
}  
.dede_pages ul li{  
float:left;  
height:18px;  
line-height:18px;  
padding:4px 10px;  
margin-right:5px;  
border:1px #b9cdff solid;  
}  
.dede_pages .thisclass{  
background:#e3ebfe;  
}

코드가 매우 간결하다는 것을 알 수 있지만 현재 버튼이 다음과 같기 때문일 것입니다. a 대신 li로 표시되므로 사용자가 버튼을 클릭했지만 텍스트를 클릭하지 않으면 버튼이 클릭되지 않았음을 의미합니다. 더 나은 사용자 경험을 위해서는 또 다른 솔루션이 필요합니다.

두 번째 방법은 include 폴더에 있는 dede:pagelist 관련 파일 arc.listview.class.php를 수정하는 것입니다:

arc.listview.class.php를 열고 찾아보세요. 다음 코드:

//获得上一页和主页的链接 
        if($this->PageNo != 1) 
        { 
            $prepage.="<li><a href=&#39;".str_replace("{page}",$prepagenum,$tnamerule)."&#39;>上一页</a></li>rn"; 
            $indexpage="<li><a href=&#39;".str_replace("{page}",1,$tnamerule)."&#39;>首页</a></li>rn"; 
        } 
        else 
        { 
            $indexpage="<li >首页</li>rn"; 
        } 
        //下一页,未页的链接 
        if($this->PageNo!=$totalpage && $totalpage>1) 
        { 
            $nextpage.="<li><a href=&#39;".str_replace("{page}",$nextpagenum,$tnamerule)."&#39;>下一页</a></li>rn"; 
            $endpage="<li><a href=&#39;".str_replace("{page}",$totalpage,$tnamerule)."&#39;>末页</a></li>rn"; 
        } 
        else 
        { 
            $endpage="<li >末页</li>rn"; 
        }

각각 수정 $indexpage="

Homepage

rn";$endpage="

마지막 페이지

rn"; $indexpage="

Homepage

rn";$endpage="

마지막 페이지

rn";에 대해 수정되었습니다. {dede:pagelist listitem="index,end,pre,next,pageno" listsize="10"/}에 의해 생성된 html 코드는 다음과 같습니다.

<li class="thisclass">首页</li> 
<li class="thisclass">1</li> 
<li><a href=&#39;news_2.html&#39;>2</a></li> 
<li><a href=&#39;news_3.html&#39;>3</a></li> 
<li><a href=&#39;news_2.html&#39;>下一页</a></li> 
<li><a href=&#39;news_3.html&#39;>末页</a></li>

두 번째 방법은 더 간단하고 더 많은 것을 추가합니다. 사용자 경험

PS: 두 번째 방법을 사용하면 CSS 파일을 수정할 필요가 없습니다.

위 내용은 Dedecms 목록 페이지 목록의 페이지 넘기기 버튼 스타일을 해결하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!