在div中沒有文字的下邊框

我想創建邊框底部。我試試這個在div中沒有文字的下邊框

<div class="borderblog"></div> 

.borderblog{ 
border-bottom: 1px dotted black; 
}

但這隻工作，如果我把一些文本在該div。像這樣

<div class="borderblog">text</div>

我不想在那裏放任何文字。我只想要有一條虛線邊框底部。我也嘗試使用人力資源標籤，但它不工作。

Demo in jsFiddle

來源

2014-03-01 Hero Stripe

爲什麼你使用'DIV'來模擬另一個DIV的邊界？ –

剛剛更新了將邊框應用於'

'元素的答案。 –

可以DIV高度設置爲一個像：

.borderblog{ 
height: 1px; 
border-bottom: 1px dotted black; 
}

事業部是塊元素，如果沒有任何背景的高度爲0，因爲邊界邊界是不可見內部分區。寬度不是必需的，因爲塊元素默認填充父容器寬度。

來源

2014-03-01 17:10:19 Hardy

組的高度和寬度

.borderblog{ 
border-bottom: 1px dotted black; 
width:20px; 
height:1px; 
}

DEMO

來源

2014-03-01 17:10:55

爲什麼寬度太？ – Hardy

它更靈活，就像你有他控制多長時間 –

好吧，它不靈活，它動態地匹配空間..例如，當調整瀏覽器窗口的大小..你知道響應.. :) – Hardy

那麼，it works for me上IE8，FF9和Chrome32。

但是，您可以使用<hr>元素創建虛線如下：

<hr class="borderblog">

.borderblog { 
    border: 0; /* <-- Reset the useragent stylesheet at first */ 
    border-bottom: 1px dotted black; 
}

WORKING DEMO。

另外，如果你需要一個堅實的邊界，如果以任何理由前面的方法並不適合你，你可以使用的背景顏色爲1px -height DIV

.borderblog { 
    height: 1px; 
    background-color: black; 
}

Demo。

在這種情況下，您還可以添加一個border-bottom以使其可視化。

Updated Demo。

來源

2014-03-01 17:10:58

div does not have any height width by default, unless you specify it

所以當你添加文本它得到了一些值並顯示，所以接壤應用

.borderblog{ 
height: 1px; 
border-bottom: 1px dotted black; 
}

來源

2014-03-01 17:11:22 Rex

所有你需要做的，只是把高度和寬度在CSS：

.borderblog{ 
    width:100px; //depends what width border you want 
    height:1px; //depends what height you want, 1px is enought for border only 
    border-bottom: 1px dotted black; 
}

這就是它，不需要內部的文本:)

來源

2014-03-01 17:14:23

在div中沒有​​文字的下邊框

回答

相關問題

在div中沒有文字的下邊框