社群
學習
工具庫
AI工具
休閒
搜尋
繁体中文
首頁 > web前端 > html教學 > html pre標籤使用詳解

html pre標籤使用詳解

黄舟
發布： 2017-07-08 10:56:38
原創
3482 人瀏覽過

html中pre標籤怎麼用

<html>
<head>
</head>
<body>
12344
</body>
</html>
登入後複製

以上一個網頁的源碼，那我現在要把源碼輸出－
那麼用pre標籤怎麼辦？ 

<pre class="brush:php;toolbar:false">
     这里写你想写的代码~~~~
登入後複製

就是這樣用的

<html>
<head>
</head>
<body>
    12344
<pre class="brush:php;toolbar:false">
<html>
<head>
</head>
<body>
    12344
</body>
</html>
登入後複製
登入後複製

這麼寫為什麼不對？

pre 元素中允許的文字可以包括物理樣式和基於內容的樣式變化，還有連結、圖像和水平分隔線。當把其他標籤（例如 標籤）放到 

 區塊中時，就像放在 HTML/XHTML 文件的其他部分一樣即可。 <br/>所以你得這樣</p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:html;toolbar:false"><pre class="brush:php;toolbar:false"><html><br><head><br></head><br><body><br>    12344<br></body><br></html>
登入後複製

注意  百度修改了程式碼  & lt;  & gt;（沒有空格）分別代表< >

#用textarea呢？怎麼用？

textarea  沒問題的

<textarea name="textarea" id="textarea" cols="45" rows="5">
<html>
<head>
</head>
<body>
<code><br>
</textarea>
登入後複製

這次明白了，再加10分吧，多謝了。 

這個標籤可以包裝的文字排版、格式，原封不動的呈現出來。你輸入的東西被原封不動的輸出,包括你輸入的空格之類的,不用和
等來表示空格或者回車了.
用於顯示源碼的確是不錯的方案
 
<pre class="brush:php;toolbar:false">
$(
function() {
$("#selectBox").mousemove(
function(event) {
$("span:eq(0)").html($("#selectArea").position().left);
$("span:eq(1)").html(event.offsetX);
if ($("#selectArea").css("position") == "absolute") {
$("#selectArea").css({ left: event.clientX - $("img").offset().left });
$("#selectArea").css({ top: event.clientY - $("img").offset().top });
}
if ($("#selectArea").css("position") == "relative") {
$("#selectArea").css({ left: -(300 - event.offsetX) });
$("#selectArea").css({ top: event.offsetY });
}
}
);
}
);
</per>
登入後複製
<html>
<head>
</head>
<body>
    12344
<pre class="brush:php;toolbar:false">
<html>
<head>
</head>
<body>
    12344
</body>
</html>




登入後複製
登入後複製
這麼寫為什麼不對？ 
哦，你要在per中寫html的程式碼啊，那你要記得
<>不能直接寫成<>,要寫出實體形式
< 小于号 < < 
> 大于号 > > 
& 和号 & & 
" 引号 " " 
&#39; 撇号  &#39; (IE不支持) &#39;
登入後複製
以上是html pre標籤使用詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章！
                

            

            

                                

                    相關標籤：
                    

                        html 標籤 詳解                    

                

                                
來源：php.cn

                            

            

                                    
                        上一篇：CSS3的新功能介紹
                    
                                    
                        下一篇：簡單介紹html 
標籤
                    
                            

            

       
                
本網站聲明

                
本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn

            

            

            

                
作者最新文章

                
            

            

                
最新問題

                

                                        

                        

                            輸入<html><>後面是怎麼變成<html></html>的
                            
                            

                                

                                     來自於 1970-01-01 08:00:00
                                

                                

                                    
  0 

                                    
0

                                    
0

                                

                            

                        

                    

                    

                                        

                        

                            angular.js - 有人知道嗎用ng-bind-html綁定html。但是html卻被轉義了
                            
                            

                                

                                     來自於 1970-01-01 08:00:00
                                

                                

                                    
  0 

                                    
0

                                    
0

                                

                            

                        

                    

                    

                                        

                        

                            HTML與HTML5的差別
                            
                            

                                

                                     來自於 1970-01-01 08:00:00
                                

                                

                                    
  0 

                                    
0

                                    
0

                                

                            

                        

                    

                    

                                        

                        

                            HTML總結
                            
                            

                                

                                     來自於 1970-01-01 08:00:00
                                

                                

                                    
  0 

                                    
0

                                    
0

                                

                            

                        

                    

                    

                                        

                        

                            HTML總結
                            
                            

                                

                                     來自於 1970-01-01 08:00:00
                                

                                

                                    
  0 

                                    
0

                                    
0

                                

                            

                        

                    

                    

                                    

            


            

                

                    
相關專題

                    更多>
                    
                

                

                    
                

            

        

    


    

    
    
        

            
熱門推薦

            

                
            

        

        
        

            

                
熱門教學

                更多>
                
            

            

                

                    
相關教學 

                    
熱門推薦

                    
最新課程

                

                
                
                
            

            
        


        

            

                
最新下載

                更多>
                
            

                        
            

                

                    
網站特效 

                    
網站源碼

                    
網站素材

                    
前端模板