如何使用 CSS 将跨度更改为看起来像 pre ？

HTML 标签用于设置分组内联元素的样式。它主要用于更改文本某些部分的 CSS 属性。
HTML

 标签是预先格式化的文本元素，以固定宽度显示文本，可以通过 CSS 更改。它也有助于节省行间距和其他格式字符。

有 3 种方法可以使用 CSS 将  标签更改为看起来像 
 标签：

方法 1：使用内联 CSS
内联 CSS 是一种使用 HTML 元素的 style 属性对 HTML 页面进行样式设置的方法。使用内联 CSS 不被认为是一种好的做法，而是取决于您正在处理的项目的大小。
通过改变span的一些CSS属性，我们可以让它看起来像
标签。
下面的示例说明了如何使用内联 CSS 将  标记更改为类似于 
。 





  
The span element
  

    GeeksForGeeks
    is the best website. 
  




输出： 

方法 2：使用内部 CSS
通过在页面的  部分声明 


  
The  element to look 
 like a 
 using Internal CSS
  

    GeeksForGeeks
    is the best website. 
  

输出：

方法 3：使用外部 CSS
外部 CSS 是通过制作不同的 CSS 文件并使用 部分中的 标签进一步链接到 HTML 文档来完成的。
下图是使用外部 CSS 将 标签更改为

 标签的示例：
 HTML文件： 






    
      


  
The  element to look like a 
 using External CSS
  

    GeeksForGeeks
    is the best website. 
  





 style.css(CSS 文件)： 


span {
    white-space: pre;
    font-family: monospace;
    display: block;
    margin: 25px;
}



输出： 

支持的浏览器：  和 
 标签支持的浏览器如下：


谷歌浏览器
IE浏览器
火狐
歌剧
苹果浏览器