1、行內盒模型內容區由font-size(文字大小樣式)決定大小。
文字大小的值常用有兩類:
① px
② em(例:1.5em、2em,含義為該文字的大小是父元素文字大小的1.5倍,2倍)
2、文字基線的位置由該字型中的x的小寫字母的底線決定
css中的單位1ex = 該文字中小寫字母x的高度
3、行框:由line-height控制最小行框高度
4、行高=(line-height + font-size)
line-height取值分兩類:
①:px,直接定義固定值
②:倍數,一當前字型大小為基數設定倍數,比如line-height:1.5,那麼實際行高的值就為16✖1.5=24px %, 字型按百分比取值,比如line-height, 那麼實際行高值為150%;16✖150%=24px
5、行間距=(line-height – font-size)直接定義類:
font-family: tahoma, 「宋體」, sansserif;
引入類:
@font-face
span
目前的字型設計領域,字型大致分為兩大類vertical-align垂直對齊
vertical-align:
baseline:使元素的基線與父元素的基線對齊
middle:使元素的中部與父元素的中線對齊
top:使元素及其後代元素的頂部與整行的頂部對齊
bottom:使元素及其後代元素的底部與整行的底部對齊。
文字縮排樣式text-indent
ext-indent:2em;/文字首行縮排2個字元/
text-indent:20px;/文字首行縮排20px/
文字對齊格式text-align
text-align:left;/左對齊/ (預設對齊方式) text-align:center;/居中對齊/ text-align:right;/右對齊/ text-align:justify; /兩端對齊/
文字裝飾text-decoration
text-decoration:underline;/下劃線/ text-decoration:line-through;/貫穿線/
text-decoration:overline;/上劃線/
行內盒模型
行內元素具有盒子模型嗎 行內元素同樣具有盒子模型。行內元素的屬性設定 行內元素的上下內邊距和外邊距屬性設定是無效的 行內元素的左右外邊距和內邊距屬性設定是有效的 行內元素的padding top padding bottom從顯示的效果上是增加的但其實設定的是無效的。並不會對他周圍的元素產生任何影響...
css 行內 塊級 盒模型
行內元素 a span strong img input select 和其他元素都在一行上 高,行高及頂和底邊距不可改變 寬度就是它的文字或的寬度,不可改變。塊級元素 h1 h6 div p ul ol li dl dt dd 總是在新行上開始 高度,行高以及頂和底邊距都可控制 寬度預設是它的容器...
盒模型詳解
每乙個元素表示乙個矩形盒子 內容content,內邊距padding。邊框borde,外邊框margin,他在頁面中佔據實際大小是content padding border margin之和 盒模型有兩種標準盒子,w3c ie盒模型 3 兩種盒模型的區別 標準盒模型內容大小就是content大小,...