アプリ版：「スタンプのみでお礼する」機能のリリースについて

XML画像データををHTMLで簡単に表示する方法

解決済

  • 質問者：murakami5656
  • 質問日時：
  • 回答数：1件

下記のXML画像データををHTMLで簡単に表示する方法をご教授下さい。

<?xml version="1.0"?>
<photos>
<photo url="http://www.kahokanko.com/demo/10.jpg"/>
<photo url="http://www.kahokanko.com/demo/19.jpg"/>
<photo url="http://www.kahokanko.com/demo/31.jpg"/>
</photos>

通報する

この質問への回答は締め切られました。

質問の本文を隠す

A 回答 (1件)

No.1ベストアンサー

  • 回答者： ORUKA1951
  • 回答日時：

HTMLと同様にスタイルシートで指定します。

XMLですから、XSLTスタイルシートでHTMLに変換して、デザインはCSSに分担させても良いでしょう。

★タブは全角スペースに置換してあるので、タブに戻すこと。

<?xml version="1.0"?>
<?xml-stylesheet type="text/xsl" href="style.xsl"?>
<photos>
　<photo url="http://www.kahokanko.com/demo/10.jpg"/>
　<photo url="http://www.kahokanko.com/demo/19.jpg"/>
　<photo url="http://www.kahokanko.com/demo/31.jpg"/>
</photos>

とします。
[style.xsl]
<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
　<xsl:template match="/">
　<html>
　　<head>
　　　<title>サンプル</title>
　　　<link rel="styleSheet" type="text/css" href="./xx.css" />
　　</head>
　　<body>
　　　<h1>画像を表示してみよう</h1>
　　　<div>
　　　　<xsl:apply-templates />
　　　</div>
　　</body>
　　</html>
　</xsl:template>
　<xsl:template match="photo">
　　<p class="album">
　　　<img>
　　　　<xsl:attribute name="src">
　　　　　<xsl:value-of select="@url" />
　　　　</xsl:attribute>
　　　</img>
　　</p>
　</xsl:template>
</xsl:stylesheet>

[xx.css]
@charset "UTF-8";
html,body{margin:0;padding:0;}
p.album img{display:block;float:left;width:360px;height:auto;margin:10px;}
    • good
    • 0
    • 件
通報する
この回答へのお礼

解りやすい回答ありがとうございました。

通報する
お礼日時：2012/11/04 08:26

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう！

Q質問する（無料）

このQ&Aを見た人はこんなQ&Aも見ています

関連するカテゴリからQ&Aを探す

ページトップページトップ

Q質問する（無料）

このQ&Aを見た人がよく見るQ&A

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング

おすすめ情報