「テンプレート:Image」の版間の差分
(タグ: 方括号不配对) |
|||
(3人の利用者による、間の4版が非表示) | |||
1行目: | 1行目: | ||
− | <div style="<!-- | + | {{#ifeq:{{{种类|{{{type|}}}}}}|outer||<div style="display:none !important;">[[file:{{{图片|{{{pic|{{{img|}}}}}}}}}|1px]]</div>}}<!-- Fix unmarked usage |
− | -->display:{{{ | + | --><div class="image-box" style="<!-- |
− | -->width:{{#expr:{{{width|0}}}+{{{wd|0}}}-{{{ | + | -->display:{{{显示类型|{{{display|block}}}}}};<!-- |
+ | -->width:{{#expr:{{{width|0}}}+{{{宽|{{{wd|0}}}}}}-{{{右|{{{clip-r|0}}}}}}-{{{左|{{{clip-l|0}}}}}}}}px;<!-- | ||
-->height:{{#expr: | -->height:{{#expr: | ||
{{{height|0}}} | {{{height|0}}} | ||
− | +{{#switch:{{{type| | + | +{{#switch:{{{种类|{{{type|none}}}}}}{{{段落|{{{phase|}}}}}} |
|tall | |tall | ||
|talldiv | |talldiv | ||
|wide | |wide | ||
|widediv | |widediv | ||
− | |box={{#ifeq:{{{ | + | |box={{#ifeq:{{{desc|caption}}}|caption |
|0 | |0 | ||
− | |abs({{{ | + | |abs({{{capht|25}}})}} |
|#default=0}} | |#default=0}} | ||
− | +{{#ifexpr:{{{ht|0}}}<=0 | + | +{{#ifexpr:{{{高|{{{ht|0}}}}}}<=0 |
− | |{{{wd|0}}}*{{{k|0}}} | + | |{{{宽|{{{wd|0}}}}}}*{{{宽高比|{{{k|0}}}}}} |
− | |{{{ht|0}}}}} | + | |{{{高|{{{ht|0}}}}}}}} |
− | -{{{ | + | -{{{下|{{{clip-b|0}}}}}} |
− | -{{{ | + | -{{{上|{{{clip-t|0}}}}}} |
}}px;<!-- | }}px;<!-- | ||
-->position:relative;<!-- | -->position:relative;<!-- | ||
− | -->{{#switch:{{{type| | + | -->{{#switch:{{{种类|{{{type|none}}}}}}{{{段落|{{{phase|}}}}}} |
|tall | |tall | ||
|talldiv | |talldiv | ||
27行目: | 28行目: | ||
|box=border:1px solid #ccc;background-color:#f9f9f9; | |box=border:1px solid #ccc;background-color:#f9f9f9; | ||
|#default=}}<!-- | |#default=}}<!-- | ||
− | -->"><!-- | + | -->{{{样式|{{{style|}}}}}}"><!-- |
--><div style="<!-- | --><div style="<!-- | ||
− | -->width:{{#expr:{{{width|0}}}+{{{wd|0}}}-{{{ | + | -->width:{{#ifeq:{{{pos|absolute}}}|absolute|{{#expr:{{{width|0}}}+{{{宽|{{{wd|0}}}}}}-{{{右|{{{clip-r|0}}}}}}-{{{左|{{{clip-l|0}}}}}}}}px|auto}};<!-- |
− | -->height:{{#expr: | + | -->height:{{#ifeq:{{{pos|absolute}}}|absolute|{{#expr: |
{{{height|0}}} | {{{height|0}}} | ||
− | +{{#ifexpr:{{{ht|0}}}<=0 | + | +{{#ifexpr:{{{高|{{{ht|0}}}}}}<=0 |
− | |{{{wd|0}}}*{{{k|0}}} | + | |{{{宽|{{{wd|0}}}}}}*{{{宽高比|{{{k|0}}}}}} |
− | |{{{ht|0}}}}} | + | |{{{高|{{{ht|0}}}}}}}} |
− | -{{{ | + | -{{{下|{{{clip-b|0}}}}}} |
− | -{{{ | + | -{{{上|{{{clip-t|0}}}}}} |
− | }}px;<!-- | + | }}px|auto}};<!-- |
− | -->border-radius:{{{ | + | -->border-radius:{{{rads|{{{rad1|{{{radius|0}}}}}}{{{rad1-dt|{{{rad-dt|px}}}}}} {{{rad2|{{{radius|0}}}}}}{{{rad2-dt|{{{rad-dt|px}}}}}} {{{rad3|{{{radius|0}}}}}}{{{rad3-dt|{{{rad-dt|px}}}}}} {{{rad4|{{{radius|0}}}}}}{{{rad4-dt|{{{rad-dt|px}}}}}}}}};<!-- |
− | -->position:absolute;<!-- | + | -->position:{{{pos|absolute}}};<!-- |
− | -->left:{{{ | + | -->left:{{#ifeq:{{PAGENAME}}|{{{iflink|about:blank}}}|{{{iflink-h|{{#expr:{{{横|{{{h|0}}}}}}+{{{iflink+h|0}}}}}}}}|{{{横|{{{h|0}}}}}}}}px;<!-- |
− | -->top:{{#expr:{{{ | + | -->top:{{#expr:{{#ifeq:{{PAGENAME}}|{{{iflink|about:blank}}}|{{{iflink-v|{{#expr:{{{纵|{{{v|0}}}}}}+{{{iflink+v|0}}}}}}}}|{{{纵|{{{v|0}}}}}}}}-{{#ifexpr:{{{capht|25}}}<0|{{{capht|0}}}|0}}}}px;<!-- |
− | -->{{#switch:{{{type| | + | -->{{#switch:{{{种类|{{{type|none}}}}}}{{{段落|{{{phase|}}}}}} |
|talldiv | |talldiv | ||
|tall=overflow-x:hidden;overflow-y:scroll; | |tall=overflow-x:hidden;overflow-y:scroll; | ||
|widediv | |widediv | ||
|wide=overflow-x:scroll;overflow-y:hidden; | |wide=overflow-x:scroll;overflow-y:hidden; | ||
− | |#default=overflow:hidden;}}<!-- | + | |#default=overflow:{{#ifeq:{{{pos|absolute}}}|absolute|hidden|inherit}};}}<!-- |
-->z-index:1<!-- | -->z-index:1<!-- | ||
-->"><!-- | -->"><!-- | ||
− | -->{{#switch:{{{type| | + | -->{{#switch:{{{种类|{{{type|none}}}}}}{{{段落|{{{phase|}}}}}} |
|talldiv | |talldiv | ||
|widediv | |widediv | ||
|div=<div style="<!-- | |div=<div style="<!-- | ||
-->position:absolute;<!-- | -->position:absolute;<!-- | ||
− | -->top:{{#expr:0-{{{y|0}}}-{{{ | + | -->background:{{{背景色|{{{bgk|none}}}}}};<!-- |
− | -->left:{{#expr:0-{{{x|0}}}-{{{ | + | -->box-shadow:{{{shadow| |
+ | {{{左阴影|{{{阴影粗细|0}}}}}}px 0px {{{左模糊|{{{模糊|0}}}}}}px {{{左阴影色|{{{阴影色|}}}}}} {{{阴影模式|inset}}}, | ||
+ | 0px {{{上阴影|{{{阴影粗细|0}}}}}}px {{{上模糊|{{{模糊|0}}}}}}px {{{上阴影色|{{{阴影色|}}}}}} {{{阴影模式|inset}}}, | ||
+ | -{{{右阴影|{{{阴影粗细|0}}}}}}px 0px {{{右模糊|{{{模糊|0}}}}}}px {{{右阴影色|{{{阴影色|}}}}}} {{{阴影模式|inset}}}, | ||
+ | 0px -{{{下阴影|{{{阴影粗细|0}}}}}}px {{{下模糊|{{{模糊|0}}}}}}px {{{下阴影色|{{{阴影色|}}}}}} {{{阴影模式|inset}}}}}};<!-- | ||
+ | -->top:{{#expr:0-{{#ifeq:{{PAGENAME}}|{{{iflink|about:blank}}}|{{{iflink-y|{{#expr:{{{y|0}}}+{{{iflink+y|0}}}}}}}}|{{{y|0}}}}}-{{{上|{{{clip-t|0}}}}}}}}px;<!-- | ||
+ | -->left:{{#expr:0-{{#ifeq:{{PAGENAME}}|{{{iflink|about:blank}}}|{{{iflink-x|{{#expr:{{{x|0}}}+{{{iflink+x|0}}}}}}}}|{{{x|0}}}}}-{{{左|{{{clip-l|0}}}}}}}}px;<!-- | ||
-->"><!-- | -->"><!-- | ||
− | -->{{{pic|}}}<!-- | + | -->{{{图片|{{{pic|{{{img|}}}}}}}}}<!-- |
--></div> | --></div> | ||
− | |#default={{#ifeq:{{{link|null}}}|null | + | |#default={{#ifeq:{{{link|{{{iflink|null}}}}}}|null |
− | |< | + | |<div style="<!-- |
− | -->position:absolute;<!-- | + | -->position:{{{pos|absolute}}};<!-- |
− | -->top:{{#expr:0-{{{y|0}}}-{{{ | + | -->background:{{{背景色|{{{bgk|none}}}}}};<!-- |
− | -->left:{{#expr:0-{{{x|0}}}-{{{ | + | -->box-shadow:{{{shadow| |
− | -->" src="{{#switch:{{{type|null}}} | + | {{{左阴影|{{{阴影粗细|0}}}}}}px 0px {{{左模糊|{{{模糊|0}}}}}}px {{{左阴影色|{{{阴影色|}}}}}} {{{阴影模式|inset}}}, |
− | |outer={{{pic|null}}} | + | 0px {{{上阴影|{{{阴影粗细|0}}}}}}px {{{上模糊|{{{模糊|0}}}}}}px {{{上阴影色|{{{阴影色|}}}}}} {{{阴影模式|inset}}}, |
− | |#default={{filepath:{{PAGENAME:File:{{{pic|null}}}}}}}}}<!-- | + | -{{{右阴影|{{{阴影粗细|0}}}}}}px 0px {{{右模糊|{{{模糊|0}}}}}}px {{{右阴影色|{{{阴影色|}}}}}} {{{阴影模式|inset}}}, |
− | -->" width="{{{resize|{{{wd|0}}}}}}px" /> | + | 0px -{{{下阴影|{{{阴影粗细|0}}}}}}px {{{下模糊|{{{模糊|0}}}}}}px {{{下阴影色|{{{阴影色|}}}}}} {{{阴影模式|inset}}}}}};<!-- |
− | |[[{{{link|null}}}|< | + | -->top:{{#expr:0-{{#ifeq:{{PAGENAME}}|{{{iflink|about:blank}}}|{{{iflink-y|{{#expr:{{{y|0}}}+{{{iflink+y|0}}}}}}}}|{{{y|0}}}}}-{{{上|{{{clip-t|0}}}}}}}}px;<!-- |
− | -->position:absolute;<!-- | + | -->left:{{#expr:0-{{#ifeq:{{PAGENAME}}|{{{iflink|about:blank}}}|{{{iflink-x|{{#expr:{{{x|0}}}+{{{iflink+x|0}}}}}}}}|{{{x|0}}}}}-{{{左|{{{clip-l|0}}}}}}}}px;<!-- |
− | -->top:{{#expr:0-{{{y|0}}}-{{{上|0}}}}}px;<!-- | + | -->"><img class="image" style="position:relative;z-index:-1;{{{img-css|}}}" src="{{#switch:{{{种类|{{{type|null}}}}}} |
− | -->left:{{#expr:0-{{{x|0}}}-{{{ | + | |outer={{{图片|{{{pic|{{{img|null}}}}}}}}} |
− | -->max-width:{{{resize|{{{wd|1000}}}}}}px !important;<!-- | + | |#default={{#ifeq:{{{thumb|no}}}|yes|{{fullurl:cm:}}thumb.php?f={{{图片|{{{pic|{{{img|}}}}}}}}}&width={{{缩放|{{{resize|{{{宽|{{{wd|0}}}}}}}}}}}}|{{filepath:{{PAGENAME:File:{{{图片|{{{pic|{{{img|null}}}}}}}}}}}}}}}}}<!-- |
− | -->" src="{{#switch:{{{type|null}}} | + | -->" width="{{#ifeq:{{{pos|absolute}}}|absolute|{{{缩放|{{{resize|{{{宽|{{{wd|0}}}}}}}}}}}}px|auto}}" /></div> |
− | |outer={{{pic|null}}} | + | |[[{{{link|{{{iflink|null}}}}}}|<span style="<!-- |
− | |#default={{filepath:{{PAGENAME:File:{{{pic|null}}}}}}}}}<!-- | + | -->position:{{{pos|absolute}}};<!-- |
− | -->" width="{{{resize|{{{wd|0}}}}}}px" />]]}}}}<!-- | + | -->top:{{#expr:0-{{#ifeq:{{PAGENAME}}|{{{iflink|about:blank}}}|{{{iflink-y|{{#expr:{{{y|0}}}+{{{iflink+y|0}}}}}}}}|{{{y|0}}}}}-{{{上|{{{clip-t|0}}}}}}}}px;<!-- |
+ | -->left:{{#expr:0-{{#ifeq:{{PAGENAME}}|{{{iflink|about:blank}}}|{{{iflink-x|{{#expr:{{{x|0}}}+{{{iflink+x|0}}}}}}}}|{{{x|0}}}}}-{{{左|{{{clip-l|0}}}}}}}}px;<!-- | ||
+ | -->max-width:{{{缩放|{{{resize|{{{宽|{{{wd|1000}}}}}}}}}}}}px !important;<!-- | ||
+ | -->"><img class="image" style="position:relative;z-index:-1;{{{img-css|}}}" src="{{#switch:{{{种类|{{{type|null}}}}}} | ||
+ | |outer={{{图片|{{{pic|{{{img|null}}}}}}}}} | ||
+ | |#default={{#ifeq:{{{thumb|no}}}|yes|{{fullurl:cm:}}thumb.php?f={{{图片|{{{pic|{{{img|}}}}}}}}}&width={{{缩放|{{{resize|{{{宽|{{{wd|0}}}}}}}}}}}}|{{filepath:{{PAGENAME:File:{{{图片|{{{pic|{{{img|null}}}}}}}}}}}}}}}}}<!-- | ||
+ | -->" width="{{#ifeq:{{{pos|absolute}}}|absolute|{{{缩放|{{{resize|{{{宽|{{{wd|0}}}}}}}}}}}}px|auto}}" /></span>]]}}}}<!-- | ||
--></div><!-- | --></div><!-- | ||
− | -->{{# | + | --><div {{#if:{{{desc|caption}}}|class="thumbcaption"}} style="<!-- |
− | + | -->position:{{{pos|absolute}}};<!-- | |
− | |||
− | |||
− | |||
− | |||
− | |||
− | -->position:absolute;<!-- | ||
-->width:calc(100% - 6px);<!-- | -->width:calc(100% - 6px);<!-- | ||
− | + | -->{{#ifexpr:{{{capht|25}}}<0 | |
− | -->{{#ifexpr:{{{ | ||
|top:0px; | |top:0px; | ||
|bottom:0px;}}<!-- | |bottom:0px;}}<!-- | ||
− | -->overflow: | + | -->overflow:{{#ifeq:{{{pos|absolute}}}|absolute|inherit|auto}};<!-- |
-->"><!-- | -->"><!-- | ||
− | -->{{#switch:{{{type| | + | -->{{#switch:{{{种类|{{{type|none}}}}}}{{{段落|{{{phase|}}}}}} |
|tall | |tall | ||
|talldiv | |talldiv | ||
|wide | |wide | ||
|widediv | |widediv | ||
− | |box={{{ | + | |box={{{desc|caption}}} |
|#default=}}<!-- | |#default=}}<!-- | ||
− | -->{{#switch:{{{ | + | -->{{#switch:{{{段落|{{{phase|}}}}}} |
|div= | |div= | ||
− | |#default={{#switch:{{{ | + | |#default={{#switch:{{{caplink|null}}} |
|null= | |null= | ||
− | |#default=<div style="float:right;">[ | + | |#default=<div style="float:right;">[{{fullurl:cm:File:{{{图片|{{{pic|{{{img|null}}}}}}}}}}} {{{caplink|null}}}]</div>}}}}<!-- |
− | --></div> | + | --></div><!-- |
--></div><noinclude>{{Documentation}}</noinclude> | --></div><noinclude>{{Documentation}}</noinclude> |
2024年10月20日 (日) 01:51時点における最新版
Bleeding line
相关应用
protype
<div style="position:relative;display:inline-block;"> <div style="position:absolute;top:0;left0;max-width:1000px !important;width:260px;height:430px;overflow:hidden;"> <img src="{{filepath:画像の名前.png}}" width="480px" style="position:absolute;left:-130px;top:-130px;"/> </div> </div>
Attributes 説明
- fullname(short):description
- display(dis):this attribute decided element's display type,the default value is block。CSS display 属性
- type:The default value is null.The valid parameter could be tall,wide,box,outer,div.Tall image use 'tall',wide image use 'wide',and there will be a scrollbar.'box' just as framed box that could be a description area,use text(txt) to write sth.'div' that makes pic attribute no limit.
- phase(p):the default value is null,the valid parameter could bediv。(But I just forget what can it do)
- text(txt):description.the default value is 'description'.If the type is box、outer、tall、wide,there will be a border:1px solid #ccc.
- p-ht:Tips:Do not use this with outer-y.
- link-text:Add a link-text to description area,outer link is not OK。
- link:outer link is not OK。
- pic:The default value is null.If want to use outer picture,use 'outer' type。
- Tips:These Attributes ues 'px',just be a number,percent is not surported.
- wd:Decided width,the default value is 0.Element width,picture wide.
- ht:Decided height,the default value is 0.Element height.
- k:Decided aspect ratio,the default value is 0,only if ht=0,ht=wt*k.
- width:Decided bleeding line,the default value is 0,Sprites mode.
- height:Decided bleeding line,the default value is 0,Sprites mode.
- x:Decide Bleeding line horizontal offset,the default value is 0,Sprites mode.
- y:Decide Bleeding line vertical offset,the default value is 0,Sprites mode.
- radius:border-radius,the default value is 0.
- resize:resize a picture,it will overwirte partial wd&width.Sprites mode.
- If you want a srcollbar that must be a resize attribute.IMPORTANT
- left(lt):Cut off from left,the default value is 0。
- up:Cut off from top,the default value is 0。
- left(lt):Cut off from right,the default value is 0。
- down(dn):Cut off from bottom,the default value is 0。
- out-x:Decide element horizontal offset,the default value is 0。
- out-y:Decide element vertical offset,the default value is 0。
Tips
- If you don't kown a picture's size,you can ues resize to set it's size.That makes wd and width equls resize,just ues x&y to offset the picture.
- just like:……|resize=100|wd=100|ht=100|x={{#expr:100*0}}|y={{#expr:120*3}}……
例
{{image|display=inline-block|pic=Wynn_the_Wind_Charmer.jpg|wd=250|ht=250|type=box|p-ht=25|text=風霊使いウィン|link-text=風霊使い ウィン}} {{image|display=inline-block|pic=Wynn_the_Wind_Charmer.jpg|wd=250|ht=250|x=20|y=-100|out-ht=20}} {{image|display=inline-block|pic=Wynn_the_Wind_Charmer.jpg|wd=250|ht=250|up=20|lt=30|rt=85}} {{image|display=inline-block|pic=Wynn_the_Wind_Charmer.jpg|wd=500|ht=250|radius=30|lt=125|rt=125|up=150|down=-150}} {{image|display=inline-block|pic=Wynn_the_Wind_Charmer.jpg|width=200|height=200|resize=250|x=80|y=80|down=30|rt=30|type=box|p-gt=-25|txt=風霊使いウィン}}