最近在論壇上很多使用者提及到怎麼更改 Discuz X 模板中 diy,如何調節會員頭像列表的問題。在呼叫頭像列時用到的模組模板

  1. <div >
  2. <ul>
  3. [loop]
  4. <li>
  5.         <a href="http://url" c="1"{target}><img  width =」48」 height=」48」 src="{avatar}"  alt="{title}" /></a>
  6.         <p><a href="http://url" title="{title}"{target}>{title}</a></p>
  7. </li>
  8. [/loop]
  9. </ul>
  10. </div>

有些使用者說更改將 {avatar} 更成 {avatar_middle} 再調節 width 、 height 大小但是頭像的大小卻沒有改變,原因是在樣式檔案中定義了 img 的寬度大小 (樣式級別> 標籤屬性級別)
現在告訴大家更改的方法,開啟 common.css 樣式檔案
調節.mls img{} 中 width 和 height 的大小,.mls li{} 中 width 大小,注意:.mls li{} 中的 width 一定要大於 .mls img{} 中的 width 和 height 的大小,這樣圖片才不會緊貼在一起。然後在後臺更新快取

  1. 找打如下:
  2. /* 圖片列表 */
  3. .ml {}
  4.         .ml li { float: left; padding: 0 5px 5px; text-align: center; overflow: hidden; }
  5.                 .ml img { display: block; margin: 0 auto; }
  6.                 .ml p, .ml span { display: block; width: 100%;
    height: 20px; white-space: nowrap; text-overflow: ellipsis; overflow:
    hidden; }
  7.                 .ml span, .ml span a { color: {LIGHTTEXT}; }
  8.         .mls li { padding: 0 0 5px; width: 66px; } 更改此處
  9.                 .mls img { width:48px; height:48px; } 更改此處
  10.                 .mls p { margin-top: 5px; }
  11.         .mlm li { padding: 0 0 5px; width: 150px; }
  12.                 .mlm img { width: 120px; height: 120px; }
  13.         .mla li { width: 140px; height: 224px; }
  14.         .mla1 li { height: 150px; }
  15.                 .mla .c { margin: 0 auto; width: 136px; height: 150px; background: url({IMGDIR}/gb.gif) no-repeat 0 0; }
  16.                         .mla .a { background-position: 0 100%; }
  17.                         .mla .c a { display: block; padding: 14px 4px 3px 8px; width: 120px; height: 120px; overflow: hidden; }
  18.                 .mla img { max-width: 120px; max-height: 120px;
    _width: expression(this.width > 120 &&
    this.width>=this.height ? 120 : true); _height:
    expression(this.height > 120 && this.width<=this.height ?
    120 : true); }
  19.         .mlp li { width: 140px; height: 140px; }
  20.         .mlp .d { padding: 0 0 5px; width: 150px; height: 180px; }