100字范文,内容丰富有趣,生活中的好帮手!
100字范文 > CSS——行高 字体 文本的样式

CSS——行高 字体 文本的样式

时间:2022-02-10 11:18:04

相关推荐

CSS——行高 字体 文本的样式

一、行高

行高(line height)行高指的是文字占有的实际高度可以通过line-height来设置行高行高可以直接指定一个大小(ex pm)也可以设置一个整数如果是一个整数行高将会是字体的指定的倍数默认行高是1.33行高经常用来设置文字的行间距行间距等于行高减去字体大小字体框:设置字体框就是字体存在的格子,设置font-size实际上设置我们字体框的高度行高会在字体框的上下平均分配可以将行高设置为和高度一样的值,使单行文字在一个元素中垂直居中font-size: 50px;line-height: 200px;

二、字体

/* font-face可以将服务器中的字体直接提供给用户去使用 */@font-face {/* 指定字体的名字 */font-family: 'myfont';/* 服务器字体的路径 */src: url('./xx/xxxx.ttf');}p{和font-size相关的单位em 相当于当前元素的一个font-sizerem 相当于根元素的font-sizefont-family 字体族(字体的格式)可选值:serif :衬线字体 sans-serif:非衬线字体monospace:等宽字体cursive:草书字体fantasy:虚幻字体指定字体的类别 浏览器会自动使用该类别下的字体font-family可以指定多个字体 使用逗号隔开,优先使用第一个 第一个无法使用则使用第二个 以此类推。/*font-family: 'Courier New', Courier, monospace;*/font可以设置字体相关所有属性 语法:字体大小/指定行高 字体族 行高可以省略不写 如果不写它会使用默认值简写属性省略用的是默认值font: 50px/2 'Courier New', Courier, monospace ;font-weight设置字体加粗效果 可选值:normal 默认值 不加粗bold 加粗100-900级别(没什么用)font-style :normal正常italic斜体

二、文本样式

text-align 文本的水平对齐可选值:left左侧对齐right右侧对齐center居中对齐justify两端对齐vertical-align 垂直对齐可选值baseline 默认值 基线对齐top顶部对齐 bottom 底部对齐middle 居中对齐text-decoration设置文本修饰可选值:none什么都没有underline下划线line-through删除线overline上划线white-space 用来设置网页如何处理空白可选值:normal正常nowrap不换行pre保留空白 保留文本格式/* 设置省略号效果 */white-space:nowrap ;overflow: hidden;text-overflow: ellipsis;

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。