只隱藏html段落中的文本

我想隱藏段落中的文本，但其上有一個圖像和一些文本。當我使用CSS來顯示沒有，所以所有的段落都隱藏了......但我只想隱藏文字而不是圖像。這是代碼。只隱藏html段落中的文本

<p> 
    <a href="/_blog/News_and_Inspiration/post/Cooking_up_a_storm/"><img alt="" style="border: 0px solid; width: 100px; height: 150px; float: left; margin-right: 10px; margin-bottom: 10px;" src="/images/blog/Shaun-Clouston.jpg" /></a> 
    The executive chef of Wellington&rsquo;s award winning Restaurant, Shaun Clouston is just one of the award winning New Zealand Beef and Lamb Ambassador chefs we have cooking up a storm at our Rural Women New Zealand Beef + Lamb Cooking Demonstrations over the coming months.&nbsp; 
</p> 

<p> 
    <img src="/images/blog/Southland Life Education Trust Car 2.jpg" alt=""> 
    Two years ago the Southland Life Education Community Trust approached our four Southland Provincials, asking for assistance to replace their educator’s car, as the current one needed major repairs. 
</p>

來源

2012-07-04 asif

代碼比這個圖像預覽更好。 – SVS

@svs你沒有OCR？ –

得到了jsfiddle？ – starbeamrainbowlabs

嘗試：

p { 
    font-size: 0; 
}

，並指定字體大小爲你想要的任何可見的後代元素。

來源

2012-07-04 08:59:02

注意。小心IE瀏覽器。它會失敗的:) :) – PeeHaa

@PeeHaa在IE9中工作，但IE8仍然顯示小文本。 –

我知道..... :-) – PeeHaa

根據您的佈局的休息，是否需要堅持display: none;隱藏的內容，你可以visbility: hidden;在下面的示例中使用，如：

p { 
    visibility: hidden; 
} 

img { 
    visibility: visible; 
}

見例如撥弄here。

來源

2012-07-04 09:01:19 Sirko

這實際上是一個非常好的答案，但重點必須放在佈局的其餘部分上，因爲「visibility：hidden」元素仍然可以佔用頁面上的空間。「display：none」必然是遺傳的，儘管我認爲它更有意義。 –

thnks David Thomas其工作效率更高... – asif

@asif因此，您應該接受他的回答以顯示其他問題，解決您的問題。 – Sirko

另一種選擇：

p{ 
     text-indent: -1000px; 
    } 
    img{ 
     position: absolute; 
     left:10px; /*obviously position how you like*/ 
    }

來源

2012-07-04 09:06:20 Rhyso

如果文本很長，'letter-spacing：-negative value'也可以幫助 – biziclop

你可以把你的文本跨度並使其顯示：無;希望這將幫助你:)

p span { 
display:none; 
} 

<p> 
    <a href="/_blog/News_and_Inspiration/post/Cooking_up_a_storm/"><img alt="" style="border: 0px solid; width: 100px; height: 150px; float: left; margin-right: 10px; margin-bottom: 10px;" src="/images/blog/Shaun-Clouston.jpg" /></a> 
    <span>The executive chef of Wellington&rsquo;s award winning Restaurant, Shaun Clouston is just one of the award winning New Zealand Beef and Lamb Ambassador chefs we have cooking up a storm at our Rural Women New Zealand Beef + Lamb Cooking Demonstrations over the coming months.&nbsp;</span> 
</p>

來源

2012-07-04 11:21:36

許多選項存在，

文字和背景顏色相同
字號0像素
顯示無
visibility：hidden的和許多更多...

如果幫助，很好。謝謝，

來源

2016-02-12 11:59:14 loyola

只隱藏html段落中的文本

回答

相關問題