Maison > Tutoriel CMS > DEDECMS > le corps du texte

Comment contrôler la taille des vignettes de la page de liste dedecms

藏色散人
Libérer: 2019-12-11 09:45:32
original
2417 Les gens l'ont consulté

Comment contrôler la taille des vignettes de la page de liste dedecms

Comment contrôler la taille des vignettes de la page de liste des dedecms ?

Parfois, lorsque nous créons des vignettes, nous devons tenir compte de la taille des vignettes. Voici un bref partage pour la commodité des amis dans le besoin

Apprentissage recommandé : Dreamweaver cms

méthode de contrôle de la taille des vignettes de la page de liste dede, début de la liste

Le code est le suivant :

{dede:list pagesize='10'} ----调用的条数10条---
<li> 
[field:array runphp=&#39;yes&#39;]@me = (empty(@me[&#39;litpic&#39;]) ? "" : "<a <a href="mailto:href=&#39;{@me[&#39;arcurl&#39;]}&#39;">href=&#39;{@me[&#39;arcurl&#39;]}&#39;</a> class=&#39;preview&#39;><img <a href="mailto:src=&#39;{@me[&#39;litpic&#39;]}&#39;/></a">src=&#39;{@me[&#39;litpic&#39;]}&#39;/></a</a>>"); 
[/field:array] ---这里控制的是缩略图----如果要控制图片的高度需要修改: <img <a href="mailto:src=&#39;{@me[&#39;litpic&#39;]}&#39;">src=&#39;{@me[&#39;litpic&#39;]}&#39;</a> 这里现在的是宽度:
img <a href="mailto:src=&#39;{@me[&#39;litpic&#39;]}&#39;">src=&#39;{@me[&#39;litpic&#39;]}&#39;</a> iwidth=&#39;300&#39; height=&#39;370&#39; 这里控制了宽度的大小,以及高度
--------------------------------------
[<b>[field:typelink/]</b>] ----这里控制的是栏目----
<a href="[field:arcurl/]" class="title">[field:title/]</a> ---这里控制的是标题,标题链接----
<span class="info"> -----这里控制的是描述
<small>日期:</small>[field:pubdate function="GetDateTimeMK(@me)"/] <small>点击:</small>[field:click/] <small>好评:</small>[field:scores/] </span>
<p class="intro"> [field:description/]... </p> ----描述-----
</li>
{/dede:list}
Copier après la connexion

Si vous souhaitez contrôler la hauteur de l'image Besoin de modifier :

Méthode 1 :

Le contrôle de la taille de l'image de ce modèle est contrôlé par CSS

Pour modifier le CSS

Modifiez la zone d'image droite

templets/style/picture.css文件
.pbox 样式
Copier après la connexion

Comme la taille de l'image

.pbox dl dt{
width:188px;
height:132px;
display:block;
overflow:hidden;
}
.pbox dl dt a img{
display:block;
width:expression(this.width > this.height && this.width >176 ? 176 : true);
height:expression(this.height > this.width && this.height > 132? 132 : true);
max-width:176px;
max-height:132px;
margin:0px auto 0px;
}
Copier après la connexion

Méthode 2 :

{dede:list pagesize=&#39;15&#39; imgwidth=&#39;100&#39; imgheight=&#39;70&#39; infolen=&#39;180&#39;}
Copier après la connexion

Méthode 3 :

Remplacer l'étiquette [champ : imglink/] dans le code d'appel avec

<a href=&#39;[field:arcurl /]&#39; target="_blank"><img src=&#39;[field:picname /]&#39; border=&#39;0&#39; width=&#39;&#39; height=&#39;&#39;></a>
Copier après la connexion

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal