将块级&amp；lt；span&amp；元素放入&amp；

沃梦达教程前端问题

2022-09-06

Putting a block level amp;lt;spanamp;gt; element inside a amp;lt;pamp;gt; element(将块级amp；lt；spanamp；元素放入amp；lt；pamp；元素中)

本文介绍了将块级&amp；lt；span&amp；元素放入&amp；lt；p&amp；元素中的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我知道<p>将专门用于内联元素。但是，如果使用{ display:block }将类似<span>的内联元素更改为块级元素并将其包含在<p>中怎么办？

即

<html>
<head>
<style>

  p {
    background: red;
    height: 100px;
    width: 100px;
    }

  p span {
    display: block;
    background: blue;
    height: 50px;
    width: 50px;
    }

</style>
</head>

<body>

<p>
  <span>I am a pizza</span>
</p>

</body>
</html>

这个词在任何意义上都是错误的吗？我知道这并不常见(即。大多数人会问我为什么不直接使用div)，但这只是一种假设情况。它通过了验证测试，但它是不是像所有该死的/糟糕的做法一样草率？如果你读了那个代码，你会嗤之以鼻吗？

推荐答案

它是HTML5有效的，在某些情况下并不是那么糟糕，例如

<p>
   This is some text <span class="highlight">I am a pizza</span> and this is some more text...
</p>

.highlight {
  background: yellow;
}

这篇关于将块级&amp；lt；span&amp；元素放入&amp；lt；p&amp；元素中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持编程学习网！

沃梦达教程

本文标题为：将块级&amp；lt；span&amp；元素放入&amp；

上一篇：使用Google App脚本在Gmail草稿中从PC附加文件

下一篇：阻止&amp；lt；A&amp；gt；内联&amp；lt；

基础教程推荐

学习HTML

学习jQuery

学习Laravel

学习CSS3

学习Vue.js

学习Bootstrap5

学习ThinkPHP

学习AJAX