首页 > 其他分享 >css字体样式

css字体样式

时间:2023-10-08 19:13:22浏览次数:33  
标签:字体大小 normal 样式 字体 font css 属性

 

1.font-style 设置字体样式

属性值:

    normal:指定⽂本字体样式为正常的字体

    italic:指定⽂本字体样式为斜体。

2.文字字体

font-family 只能引用系统自带的字体样式,如果需要其他别的字体,需要从外部下载调用

引用外部字体   网站:https://font.chinaz.com/katongziti.html

3、字体粗细

font-weight 定义字体粗细

1)normal:正常的字体。相当于number为400

2)bold:粗体。相当于number为700

3)bolder:特粗体。也相当于strong和b标签的作⽤

4)lighter:细体

5):⽤数字表示⽂本字体粗细。取值范围:100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900

4、字体大小

font-size 定义字体大小

常用单位:px  %  em  rem

5、字体行高

line-height  设置行高

常用值:normal  、px  、%  、em

作用:当行高和高一致时,单行字段垂直居中

6、综合设置

CSS字体属性font定义字体,加粗,⼤⼩,⽂字样式。 该属性是复合属性

 字体符合属性值的顺序:    font:<font-style> <font-weight> <font-size>/<line-height> <fon-family>

必须按顺序写,不需要的值可以省略不写,复合属性的值最少两个以上。

     
     
     

 

标签:字体大小,normal,样式,字体,font,css,属性
From: https://www.cnblogs.com/ljygzyblog/p/css.html

相关文章

  • 在 Less 中使用与 Less 内置函数同名的原生 CSS 函数
    参考资料calc()-CSS:层叠样式表|MDNGettingstarted-Escaping|Less.jsUsingTheCSSFunctioncalc()InsideTheLESSCSSPreprocessor问题描述在原生CSS中有以下的函数:calc()、max()、min()等,而在Less中也有同名的函数,使用的时候可能会冲突,无法得到需要的结......
  • 华为iStack、 CSS 、Eth-Trunk、 M-LAG
    一、iStack设备堆叠1、定义堆叠是指将多台支持堆叠的特性交换机设备组合在一起,从逻辑上组合成一台交换设备。2、为什么要使用堆叠技术?(3个优点)通过交换机堆叠,可以实现网络高可靠性和网络大量数据转发,同时简化网络管理。3、iStack基本概念角色(堆叠中所有的交换机都称为成员交换机)主......
  • chrome浏览器显示网页字体不正常,需要放大150% 显示正常
    软件环境:windows764位、chrome109.0.5414.120。故障现象:chrome浏览器,浏览百度、淘宝等网站总是需要把显示分辩率放大150%,然后显示正常。解决方案:下载windows7 kb2670838补丁安装后,重启电脑,打开chrome浏览器浏览网页显示正常。 ......
  • css中的字体样式
    一.字体的样式font-style:"normal"正常font-style:"italic"斜体 二.字体的粗细font-weight:"bold/bolder";bold是粗体 font-weight:400;400,500为正常500<为粗体>400为细体 三.字体的家庭font-family可以自己外部引入字体 四.行高line-height:200px 使文......
  • css的认知与样式
    #1.介绍##目录- [1.介绍](#1-介绍)- [2.CSS语法](#2-CSS语法)- [3.CSS注释](#3-CSS注释)- [4.CSS中的颜色值](#4-CSS中的颜色值)- [5.CSS长度单位](#5-CSS长度单位)- [6.html引入CSS的三种方法](#6-html引入CSS的三种方法)- [6.1行内样......
  • 多级编号与样式
    问题:多级编号与样式如何用解决: 选取待编号的段落》开始》编号》多级编号,选取如图所示的编号经此设置,该种编号自动与样式中的标题1-标题9绑定,对于需要设置相应编号的段落,只需要选取后应用对应样式即可。 ......
  • chrome调试工具之[hover悬浮样式]
    前言在调节带有hover样式的元素时,当鼠标移动到上面的时候才会显示相应的元素,鼠标移开时元素就会消失,所以导致无法调节样式问题,第一种方式方便定位元素位置,第二种方式可以解决问题(可以直接看第二种方法!!!)一、快捷定位元素位置的方法使用网上的方法,首先F12打开调试工具,找到加了h......
  • CSS,position: relative用法
    展示图如下:使左边区域固定展示,不受子域名的影响,所以要使用相对定位position:relative相对定位一般使用父级菜单绝对定位使用如下:绝对定位一般使用子级菜单position:absolute悬浮遮盖其余位置  ......
  • wsl中matplotlib安装中文字体
    wsl中matplotlib安装中文字体首先修改matplotlib配置的中文字体使用python定位字体路径importmatplotlibmatplotlib.matplotlib_fname()打开电脑的C:windows/fonts下,查找yahei关键字,将微软雅黑ttf字体拷贝,扔到wsl中显示的路径下的fonts/ttf文件夹里面。删除matplot......
  • 媒体查询+scss 响应式开发
    ```bash$color:#3497ee;@mixinopacity($value){opacity:$value;filter:alpha(opacity=$value*100);}@mixintransition($obj,$time){-webkit-transition:$obj$time;-moz-transition:$obj$time;-ms-transition:$obj$time;trans......