K9 通用版 博客版 主题版 地方门户版 企业版 |   企业(ASP) 分类 使用 分享 疑问 模板 建议 帮助 错误 其他
+新建主题 [Ajax]
填写帐号密码即可完成注册
+新建话题 最新回复排序 最新主题排序 精华帖子

调用图片圆角效果的标签

1Next >

催命判官 发表于:12-10-24 11:50 [添加收藏] 楼主 [回复] #Top#
催命判官 人气:495 积分:3020 金币:26497
VIP 管理团队

K9的标签如何编写才能够使得调用出来的图片呈圆角效果的缩略图,而不是用CSS来实现的呢?

其实如果你看过前面写的《K9标签基础篇:缩略图》文章,便简单的多。

获取最新的版本【查看

其中,padding画图像边缘线的取值有这么两条属性:

fillet:圆倒角边缘线

padding-r:当指定为圆角或斜倒角边缘线的时候的半径值

例子:调用图片内容的圆角效果调用标签

{@res.join table1='%s_content_isimage' table2='%s_content' field2='title,description,url,image' on='id' where='t2.status=1'order='t2.id desc' number='4'}
{#foreach($res as $rs)}
<img src="{DIR}{$rs[image] width='230' height='95' position='center' padding='fillet' padding-r='5'}" alt="{$rs[title] code='quote'}" />
{#endforeach}
以上的调用是没有阴影效果,如果想加上阴影效果(padding-filter:滤镜类型,shadow:阴影)的标签如下:

{@res.join table1='%s_content_isimage' table2='%s_content' field2='title,description,url,image' on='id' where='t2.status=1'order='t2.id desc' number='4'}
{#foreach($res as $rs)}
<img src="{DIR}{$rs[image] width='230' height='95' padding='fillet' padding-filter='shadow' padding-size='5'}" alt="{$rs[title] code='quote'}"/>
{#endforeach}

调用的效果图如下所示:

圆角效果

催命判官 发表于:12-10-24 11:53 沙发 [回复] #Top#
催命判官 人气:495 积分:3020 金币:26497
VIP 管理团队
上面的例子标签已编写在K9的默认模板default首页index.php里面
flowin 发表于:12-10-24 15:48 编辑于:10-24 15:48 板凳 [回复] #Top#
flowin 人气:111 积分:755 金币:4074
如果要兼容CSS3.0才能展现出来的话~还不如直接写CSS里面!!

CSS还是jquery实现的?
催命判官 发表于:12-10-24 17:52 5楼 [回复] #Top#
催命判官 人气:495 积分:3020 金币:26497
VIP 管理团队
Reply: 板凳

PHP版本的缩略图也是支持圆角的

{king:portal.articletype="new" number="5"}
<img src="{king:image<!-- 图片标签开始 -->
        border='fillet'<!-- 指定为圆角边框 -->
        border-color='666666'<!-- 圆角边框的颜色 -->
        empty='fillet'<!-- 外部填充部分形状 -->
        Empty-Color='#FFFFFF'<!-- 填充颜色 -->
        Empty-R='5'<!-- 填充半径 -->
        width='100' height='100'<!-- 长宽指定 -->
/}"/>
{/king:portal.article}

z 发表于:12-10-24 17:54 6楼 [回复] #Top#
z 人气:9 积分:481 金币:86
管理团队
Reply: 板凳
是用程序实现的,只是用标签输出更加方便,与CSS无关。

1Next >

发表回复

帐号 匿名发布 审核后可见 [加载完整在线编辑器]
内容
验证码
KingCMS 内容管理系统

关于我们 联系我们 广告报价 付款方式 站点导航

Copyright © 2004-2015 Focuznet All rights reserved.

广州唯众网络科技有限公司 粤ICP备08008106号

中奖了!