Wie löse ich den Umblätterschaltflächenstil der Dedecms-Listenseitenliste?
Dedecms-Liste Die Lösung für die Startseite und den letzten Seitenstil der Seitenlisten-Seitenschaltfläche
Empfohlene Lerninhalte: Dreamweaver cms
Dedecms-Liste Die Schaltfläche zum Umblättern verwendet {dede:pagelist listitem="index,end,pre,next,pageno" listsize="10"/}. Nach dem Generieren des HTML ist die erste Seite der Listenseite
<li >首页</li> <li class="thisclass">1</li> <li><a href='news_2.html'>2</a></li> <li><a href='news_3.html'>3</a></li> <li><a href='news_2.html'>下一页</a></li> <li><a href='news_3.html'>末页</a></li>
und die letzte Seite Es ist:
<li><a href='news_1.html'>首页</a></li> <li><a href='news_2.html'>上一页</a></li> <li><a href='news_1.html'>1</a></li> <li><a href='news_2.html'>2</a></li> <li class="thisclass">3</li> <li >末页</li>
Das CSS-Stylesheet der Standardvorlage:
.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; }
Sie können sehen, dass „.dede_pages ul li a“ und „.dede_pages ul li.thisclass“ beide haben padding: 2px 4px 2px; Attribute, aber „.dede_pages ul li“ nicht. Wenn „.dede_pages ul li“ nicht über das Attribut padding:2px 4px 2px; verfügt, sind die beiden Schaltflächen
Das Folgende bietet zwei Lösungen für die oben genannten Probleme
Die erste Methode wird durch CSS gelöst. Diese Lösung besteht darin, das a-Tag nicht zu steuern und nur Stile hinzuzufügen li. Der Code lautet wie folgt:
rrreeSie können sehen, dass der Code sehr prägnant ist, aber für die Benutzererfahrung nicht sehr gut ist. Dies sollte daran liegen, dass die aktuelle Schaltfläche von li anstelle von a angezeigt wird Wenn der Benutzer also auf die Schaltfläche klickt, wird dies der Fall sein. Wenn Sie nicht auf den Text klicken, klicken Sie nicht darauf. Für eine bessere Benutzererfahrung benötigen wir eine andere Lösung.
Die zweite Methode besteht darin, die dede:pagelist-bezogene Datei arc.listview.class.php im Include-Ordner zu ändern:
Öffnen Sie arc.listview.class.php und suchen Sie den folgenden Code:
.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; }
Ändern Sie $indexpage="
//获得上一页和主页的链接 if($this->PageNo != 1) { $prepage.="<li><a href='".str_replace("{page}",$prepagenum,$tnamerule)."'>上一页</a></li>rn"; $indexpage="<li><a href='".str_replace("{page}",1,$tnamerule)."'>首页</a></li>rn"; } else { $indexpage="<li >首页</li>rn"; } //下一页,未页的链接 if($this->PageNo!=$totalpage && $totalpage>1) { $nextpage.="<li><a href='".str_replace("{page}",$nextpagenum,$tnamerule)."'>下一页</a></li>rn"; $endpage="<li><a href='".str_replace("{page}",$totalpage,$tnamerule)."'>末页</a></li>rn"; } else { $endpage="<li >末页</li>rn"; }
Die zweite Methode ist einfacher und erhöht die Benutzererfahrung
PS: Verwenden Bei der zweiten Methode ist es nicht erforderlich, die CSS-Datei zu ändern.
Das obige ist der detaillierte Inhalt vonSo lösen Sie den Stil der Umblätterschaltfläche der Dedecms-Listenseitenliste. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!