个性化阅读
专注于IT技术分析

Polymerjs iron-image图像元素

<iron-image>元素用于显示图像。你可以使用有用的大小调整和预加载选项显示图像。

调整大小选项用于裁剪/覆盖或使信箱(包含)图像适合其指定大小, 而预加载选项阻止图像被渲染。同时, 你可以使用元素的CSS背景颜色作为占位符, 也可以使用data-URI。淡入淡出选项在渲染图像后淡出占位符的图像/颜色。

<iron-image>元素与<img scr =” ….”>类似, 如以下代码片段所示:

<iron-image src = "http://lorempixel.com/600/600"></iron-image>

例子

<!DOCTYPE html>
<html>
   <head>
      <title>iron-image</title>
      <base href = "https://polygit.org/components/">
      <script src = "webcomponentsjs/webcomponents-lite.js"></script>
      <link rel = "import" href = "iron-image/iron-image.html">
   </head>
  
   <body>
      <h1>Iron-Image Example</h1>
      <iron-image src = "http://www.tcgreenmedia.com/wp-content/uploads/2014/07/google-developers-v01-510x380.png" 
         alt = "iron-image" ></iron-image>
   </body>
</html>

输出

iron-image元素
赞(0)
未经允许不得转载:srcmini » Polymerjs iron-image图像元素

评论 抢沙发

评论前必须登录!