「テンプレート:Image」の版間の差分
(ページの作成:「<div style="<!-- -->display:{{dis|{{{display|block}}}}}};<!-- -->width:{{#expr:{{{width|0}}}+{{{wd|0}}}-{{{rt|{{{right|0}}}}}}-{{{lt|{{{left|0}}}}}}}}px;<!-- -->height:{{...」) |
|||
| 1行目: | 1行目: | ||
<div style="<!-- | <div style="<!-- | ||
| − | -->display:{{dis|{{{display|block}}}}}};<!-- | + | -->display:{{{dis|{{{display|block}}}}}};<!-- |
-->width:{{#expr:{{{width|0}}}+{{{wd|0}}}-{{{rt|{{{right|0}}}}}}-{{{lt|{{{left|0}}}}}}}}px;<!-- | -->width:{{#expr:{{{width|0}}}+{{{wd|0}}}-{{{rt|{{{right|0}}}}}}-{{{lt|{{{left|0}}}}}}}}px;<!-- | ||
-->height:{{#expr: | -->height:{{#expr: | ||
| 16行目: | 16行目: | ||
|{{{wd|0}}}*{{{k|0}}} | |{{{wd|0}}}*{{{k|0}}} | ||
|{{{ht|0}}}}} | |{{{ht|0}}}}} | ||
| − | -{{{down|0}}} | + | -{{{dn|{{{down|0}}}}}} |
-{{{up|0}}} | -{{{up|0}}} | ||
}}px;<!-- | }}px;<!-- | ||
| 36行目: | 36行目: | ||
|{{{ht|0}}}}} | |{{{ht|0}}}}} | ||
-{{{up|0}}} | -{{{up|0}}} | ||
| − | -{{{down|0}}} | + | -{{{dn|{{{down|0}}}}}} |
}}px;<!-- | }}px;<!-- | ||
-->border-radius:{{{rad|{{{rad1|{{{radius|0}}}px}}} {{{rad2|{{{radius|0}}}px}}} {{{rad3|{{{radius|0}}}px}}} {{{rad4|{{{radius|0}}}px}}}}}};<!-- | -->border-radius:{{{rad|{{{rad1|{{{radius|0}}}px}}} {{{rad2|{{{radius|0}}}px}}} {{{rad3|{{{radius|0}}}px}}} {{{rad4|{{{radius|0}}}px}}}}}};<!-- | ||
| 105行目: | 105行目: | ||
|#default={{#switch:{{{link|null}}} | |#default={{#switch:{{{link|null}}} | ||
|null= | |null= | ||
| − | |#default=<div style="float:right;">[https://ja.moegirl.org/file:{{{pic|null}}} {{{link|null}}}]</div>}}}}<!-- | + | |#default=<div style="float:right;">[https://ja.moegirl.org/file:{{{pic|null}}} {{{link-text|null}}}]</div>}}}}<!-- |
--></div>}}<!-- | --></div>}}<!-- | ||
--></div><noinclude>{{Documentation}}</noinclude> | --></div><noinclude>{{Documentation}}</noinclude> | ||
2017年12月27日 (水) 15:35時点における版
テンプレートの解説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=風霊使いウィン}}
caption
caption
