css讓文字位於div的底部
在實際應用中可能有這樣的需求,那就是讓文字位於div元素的底部。
下面就通過程式碼例項介紹一下如何利用css實現此功能,當然實現的方式有多種,本人就介紹一種比較常用的方式。
程式碼例項如下:
[HTML] 純文字檢視 複製程式碼執行程式碼<!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.softwhy.com/" /> <title>螞蟻部落</title> <style> #box{ width:300px; height:200px; background:#CCC; position:relative; } #box span{ position:absolute; bottom:0px; } </style> </head> <body> <div id="box"> <span>螞蟻部落歡迎您,本站地址是softwhy.com</span> </div> </body> </HTML>
上面的程式碼實現了我們的要求,將文字設定於span元素之內,然後將span元素定位於div的底部即可。
相關閱讀:
(1).相對定位參閱CSS 相對定位一章節。
(2).絕對定位參閱CSS 絕對定位一章節。
相關文章
- CSS如何讓文字居於div的底部CSS
- CSS+DIV讓頁尾始終底部CSS
- css如何怎樣讓一個div永遠在底部CSS
- 影片直播app原始碼,CSS div水平垂直居中和div置於底部APP原始碼CSS
- CSS文字沉到元素的底部CSS
- CSS+DIV讓頁尾始終保持在頁面底部CSS
- css將div固定在網頁底部程式碼例項CSS網頁
- css如何實現div中的文字垂直居中效果CSS
- css將元素固定於網頁底部CSS網頁
- css實現的文字位於圖片之上且背景半透明CSS
- css多行文字底部虛線效果程式碼例項CSS
- css如何讓div顯示在最上層CSS
- CSS讓div水平居中例項程式碼CSS
- css-flex:在不確定div高的情況下讓圖片文字上下左右居中CSSFlex
- DIV重疊 CSS讓DIV層疊 兩個DIV或多個DIV順序重疊加CSS
- 元素在div中底部顯示
- 【css】設定div位於瀏覽器的最底層,離使用者最遠CSS瀏覽器
- css文字溢位用省略號表示CSS
- CSS解決文字溢位問題CSS
- CSS文字溢位用省略號替代CSS
- css文字溢位顯示省略號CSS
- CSS 之 div中文字超出時自動換行CSS
- 神奇的 CSS,讓文字智慧適配背景顏色CSS
- CSS去掉圖片底部的空白CSS
- css如何實現多行文字在div中垂直居中效果CSS
- 固定一個div在瀏覽器底部瀏覽器
- 【HTML】有利於SEO的DIV+CSS的命名規則HTMLCSS
- CSS div居中CSS
- CSS ::marker 讓文字序號更有意思CSS
- css 多行文字溢位省略號顯示CSS
- css 單行文字溢位顯示省略號CSS
- css文字超出div隱藏剩下內容並顯示省略號CSS
- 《vue系列》github-markdown-css讓接收的文字帶樣式VueGithubCSS
- 手機直播原始碼,讓div寬度自適應文字內容原始碼
- div裡包含img底部必定多出空白的解決辦法
- CSS div居中效果CSS
- div+css排版CSS
- div按鈕CSSCSS