联系电话:020-28187900

K9标签基础篇:缩略图

发表时间:2012-06-25 阅读: 4272

目录
  1. 缩略图的调用参数
  2. 缩略图调用举例[不裁减缩图]
  3. 缩略图调用举例[自动裁图]
1、缩略图的调用参数

范例:

{$rs[image] width='200' height='400' background='#FFFAAA' }

width:图片缩略图宽度,单位值为px;

height:指定缩略图高度 ;

background:指定背景色,当不指定这个URL参数的时候,图片会以中间为中心,裁减多余的图,这个时候需要用到position来定位(见下面);若指定背景色,则自动按比缩小,并且多余的空白处用指定的颜色填充,颜色3值必须为标准十六进制颜色值,可以不带#号,如:#EEEEEE 或 FFF000,不支持red等命名形式的颜色值。

position:切图 ,其取值有:

center从中心为基点,裁掉左右或上下多出来的部分
top以顶部为基点,裁掉下面部分
left以左侧为基点,裁掉右侧部分
right以右侧为基点,裁掉左侧部分
bottom以底部为基点,裁掉上面部分
lefttop以左上角为基点,裁掉右侧和下面多出来的部分
topleft同上,为了防止混淆,top和left部分顺序
righttop参考上面lefttop和topleft例子
leftbottom参考上面lefttop和topleft例子
bottomleft参考上面lefttop和topleft例子
X,Y除了如上相对定位外,也可以输入坐标值的方法来确定裁图位置

padding:画图像边缘线,取值有:

rectangle矩形边缘线
fillet圆倒角边缘线
chamfer斜倒角边缘线

边缘线的子属性有

padding-color边缘线的色彩,如:#FF0000
padding-size边缘线的厚度,默认0
padding-r当指定为圆角或斜倒角边缘线的时候的半径值
padding-filter滤镜类型,shadow:阴影
padding-filter-color滤镜颜色,默认#666666,即深灰色

border:边框,边缘线是从外部全部填充指定的进深(padding-size)的结构,边框并不填充外边角。取值同padding

rectangle矩形边缘线
fillet圆倒角边缘线
chamfer斜倒角边缘线

边框的子属性有:

border-color边框颜色,默认黑色:#000000
border-margin边框进深值,默认0
border-r当边框类型为圆角边框或斜切边框的时候,四个倒角的半径,默认取值为:5
border-size边框的宽度,默认为1

2、缩略图调用举例[不裁减缩图]

当指定background背景颜色值的时候,做自动缩图处理,边角会以指定的颜色值填充。

background参数值必须为6位长度的数字和A-F的英文字母组合,不接受#等参数,详细色彩值请参考网页颜色表

{$info[image] width='200' height='150' background='#FFFFFF'}
当循环里调用的时候,如下:

{@data table='%s_content' field='title,image' where='status=1' number='5'}
{#foreach($data as $rs)}
<img src="{DIR}{$rs[image] width='95' height='60' background='#FFFFFF'}" alt="{$rs['title'] code='quote'}"/>
{#endforeach}
3、缩略图调用举例[自动裁图]

当不指定background值的时候,会做自动裁减处理,默认裁减位置是以图中心为基点,裁减左右和上下相对多出来的图片部分。

{@data table='%s_content' field='title,image' where='status=1' number='5'}
{#foreach($data as $rs)}
        不指定position,切除四周:<img src="{DIR}{$rs[image] width='200' height='150'}" alt="{$rs[title] code='quote'}"/>
        切除下面:<img src="{DIR}{$rs[image] width='200' height='150' position='top'}" alt="{$rs[title] code='quote'}"/>
{#endforeach}

转载请注明出处:唯众网络


相关教程 【更多】

唯众网络