css - できますかタグインタグ？

Question

重複の可能性:
アンカー内に div を配置することは正しいですか?

ある種の「商品リスト」を作成する場合、必要なリンクは 1 つだけですが、商品の画像、商品名、商品名などを含める必要があります。contain p などのタグを使用できますか? クロスブラウザの問題はありますか？

html5 ではタグに p タグを含めることができると聞きましたが、まだ使用に自信がありません。

次のようなコード:

<ul class="xxx_list">  
<li class="hproduct">  
    <a href="#" class="url" title="" target="_blank">  
        <img class="photo" src="shoujike.jpg" alt="手机壳">  
        <p>  
            <span class="price_wrap">&yen;<span class="price">88.00</span</span>  
            <span class="fav">收藏</span>  
        </p>  
        <p><a class="fn" href="">基本商品单元的商品名称&lt;/a></p>  
    </a>  
</li>  
</ul>

Answer 1

HTML 4.x (およびそれ以前) および XHTML 1.x — いいえ。<a>要素に要素を含めることはできません<p>。

HTML 5 では、要素に<a>要素を含めること<p>ができますが、ブラウザはそれについて少し不安定で、スタイルシートで<a>toを明示的に設定する必要がある場合がありdisplay: blockます。

問題のコードには、その<a>内部にも含まれてい<p>ます。これは許可されていません。要素は、別の要素<a>の子孫であってはなりません<a>。

Answer 2

Insideaタグは、デフォルトdisplay: inlineまたは。のタグにすることができますinline-block。、などspanのタグemstrong

pいくつかのクラスでに変更しspan、このクラスのCSSでいくつかのスタイルを書くことができます。

aPS：内部では使用できませんa。

アップデート：

<ul class="xxx_list">  
    <li class="hproduct">  
        <a href="#" class="url" title="" target="_blank">  
            <img class="photo" src="shoujike.jpg" alt="手机壳">  
            <span class="some-class-name">  
                <span class="price_wrap">&yen;<span class="price">88.00</span</span>  
                <span class="fav">收藏</span>  
            </span>  
            <span class="fn">基本商品单元的商品名称&lt;/span>  
        </a>  
    </li>  
</ul>