首頁 web前端 html教學 解决浏览器显示长数字不能自动换行或长字母不能换行的问题_html/css_WEB-ITnose

解决浏览器显示长数字不能自动换行或长字母不能换行的问题_html/css_WEB-ITnose

Jun 24, 2016 am 11:56 AM
字母 換行 數位 顯示 自動

在网页中,如果出现长数字或长的字母组合时,如果不加以控制,它就会破坏网页的布局,控制不好可能就会显示不全,照成显示的数据丢失。虽然这种字符串一般不会出现,但是不加以控制,被某些有心的人钻了空子,就可能破坏整个网页的布局,得不偿失,今天我就来解决下这个问题。

首先看一下是什么问题:

例如:

11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111

abcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcd

是不是把博客园的布局都给毁了??

 

然后分析一下这个问题的原因:

个人认为长数字和长字母被认为是一个单词,安道理,一个单词是不应该被分割的,要一直显示下去,被分割后就没人认识了,所以浏览器就不给你换行,照成布局被毁坏!

 然后我就在博客园的闪存那里试了下会不会出现这个问题,发现谷歌浏览器正常

看了下代码,是 word-wrap: break-word; 这句话起的作用,这句话的意思就是 内容将在边界内换行

去掉后就会变成这样

看来我们的问题已经解决了,但是ie浏览器就没有这么好了,请看下图:

没有变化,只是一大长条的数字,没有换行!

解决的方法是:在那一条长数字的外面加一个

标签就好了

请看解决后的ie的样子:

谷歌浏览器的样子:

完美解决!

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

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

Stremio字幕不工作;載入字幕時出錯 Stremio字幕不工作;載入字幕時出錯 Feb 24, 2024 am 09:50 AM

字幕在你的WindowsPC上不能在Stremio上運行嗎?一些Stremio用戶報告說,影片中沒有顯示字幕。許多用戶報告說他們遇到了一條錯誤訊息,上面寫著「載入字幕時出錯」。以下是與此錯誤一起顯示的完整錯誤訊息:載入字幕時出錯載入字幕失敗:這可能是您正在使用的插件或您的網路有問題。正如錯誤訊息所說,可能是您的網路連線導致了錯誤。因此,請檢查您的網路連接,並確保您的網路運作正常。除此之外,這個錯誤的背後可能還有其他原因,包括字幕加載項衝突、特定影片內容不支援字幕以及Stremio應用程式過時。如

桌面佈局已鎖定的原因及解決方法 桌面佈局已鎖定的原因及解決方法 Feb 19, 2024 pm 06:08 PM

顯示桌面佈局已鎖定是怎麼回事在使用電腦的過程中,有時我們可能會遇到顯示桌面佈局已鎖定的情況。這個問題意味著我們無法自由地調整桌面圖示的位置或改變桌面背景等操作。那麼,顯示桌面佈局已鎖定到底是怎麼回事?一、理解桌面佈局和鎖定功能首先,我們需要了解桌面佈局和桌面鎖定這兩個概念。桌面佈局是指桌面上各元素的排列方式,包括捷徑、資料夾和小工具等。我們可以自由

BarTender中如何換行-BarTender中換行的方法 BarTender中如何換行-BarTender中換行的方法 Mar 05, 2024 pm 07:52 PM

許多用戶在辦公室都會使用BarTender軟體,最近一些新用戶詢問BarTender中如何換行?下文小編就為各位帶來了BarTender中換行的方法,讓我們一同來下文看看吧。 1、在BarTender中,點選工具列中的建立文字按鈕,選擇建立單行文本,輸入文字內容。 2.雙擊創建的文字對象,開啟文字屬性對話框。切換至「文字格式」選項卡,將右側的「類型」勾選為「段落」。 3、點選關閉,調整文字方塊大小或輸入更多文字,或依實際要求換行都可以。

Linux小技巧:取消vim貼上時的自動縮排 Linux小技巧:取消vim貼上時的自動縮排 Mar 07, 2024 am 08:30 AM

前言vim是個強大的文字編輯的工具,在Linux端得到極大的使用熱度。最近在另外一台伺服器上使用vim時,遇到了一個奇怪的問題:當我將本地編寫好的腳本複製並貼上到伺服器中的空白檔案時,出現了自動縮排的情況。用個簡單的例子來說,就是我在本地寫的腳本如下:aaabbbcccddd當我將上述內容複製後,粘貼到伺服器中的空白文件後得到的卻是:aabbbcccddd很明顯,這是vim給我們自動進行了格式縮排。但是,這個自動有點不聰明。這裡記錄下解決方案。解決方案:設定.vimrc設定檔我們在家目錄下,新

excel表格該怎麼換行 excel表格該怎麼換行 Feb 09, 2024 pm 02:00 PM

Excel在是使用的過程中我們要進行很多不一樣的操作,有的時候需要在一個單元格內換行,那麼想要換行具體要怎麼操作呢?下面就來看看電腦excel表格換行方法吧。 【excel表格操作方法集合】excel表格怎麼換行答案:可以透過自動換行和設定儲存格格式來操作。一、自動換行1、我們在表格中選擇需要進行換行的區域之後在【開始】頁面中點擊【自動換行】;2、然後我們在調整A列寬度為合適值就可以了;二、設定單元格格式1、首先我們選擇需要進行換行的區域之後右鍵滑鼠,點選【設定儲存格格式】;2、然後在彈出的

在Linux上自動裝載驅動器 在Linux上自動裝載驅動器 Mar 20, 2024 am 11:30 AM

如果您使用Linux作業系統,並希望系統在啟動時自動載入驅動器,可以透過將裝置的唯一識別碼(UID)和掛載點路徑新增至fstab設定檔來實現。 fstab是位於/etc目錄中的檔案系統表文件,它包含了系統在啟動時需要掛載的檔案系統的資訊。透過編輯fstab文件,您可以確保在每次系統啟動時都能正確載入所需的驅動器,從而確保系統的穩定運作。自動安裝驅動器可方便地應用於多種情境。例如,我計劃將系統備份到外部儲存設備。為了實現自動化,需確保設備與系統保持連接,甚至在啟動時。同樣,很多應用程式會直接

在蘋果電腦上如何實現Excel單元格換行 在蘋果電腦上如何實現Excel單元格換行 Feb 18, 2024 pm 08:39 PM

蘋果電腦Excel單元格內換行蘋果電腦的Excel軟體是一款強大的電子表格工具,它提供了許多方便的功能,以幫助使用者進行資料處理和分析。在使用Excel時,有時我們需要在單元格內輸入多行文本,以便更好地組織和呈現資料。然而,由於蘋果電腦的Excel與Windows版本的Excel略有不同,因此換行的方法也有所不同。在Windows版本的Excel中,我們可以直

Linux 中如何查看目前目錄? Linux 中如何查看目前目錄? Feb 23, 2024 pm 05:54 PM

在Linux系統中,要顯示目前路徑可以使用pwd指令。 pwd指令是PrintWorkingDirectory的縮寫,用來顯示目前工作目錄的路徑。在終端機中輸入以下指令即可顯示目前路徑:pwd執行指令後,終端機會顯示目前工作目錄的完整路徑,如:/home/user/Documents。另外,還可以使用一些其他選項來增強pwd指令的功能,例如-P選項可以顯示出

See all articles