CSS font-size字体相关

字体大小

属性名:front-size

取值:数字+px

注意点:谷歌浏览器的默认值是16px,单位需要设置,否则是无效的。

<style>
        p{
           font-size: 30px;
        }
    </style>
</head>
<body>
    <p>今天也要加油啊!!!</p>
</body>

字体粗细

属性名:font-weight

关键字取值:

正常normal
加粗bold

纯数字取值:100~900的整百数

正常400
加粗700

注:不是所有字体都提供了9种粗细,因此部分取值页面中无变化

在实际开发中,以正常,加粗两种取值使用的最多。

<style>
        p{
          font-weight: bold;
        }
        .weight{
            font-size: 700;
        }
    </style>
</head>
<body>
    <p>今天也要加油啊!!!</p>
    <p class="weight">加油!</p>
</body>

字体样式

属性名:font-style

取值:

正常(默认值):normal

倾斜:italic

<style>
        #style{ 
            font-style: italic;
        }
    </style>
</head>
<body>
    <p id="style">加油</p>
</body>

字体样式的连写

属性名:font

取值:font:style,weight,size,family

顺序要求:可以是swsf

省略要求:只能省略前面两个,如果省略相当于设置了默认值

注意点:

如果需要同时设置单独和连写的形式

要么把单独的样式写在连写的后面

要么把单独的样式写在连写的里面(否则就相当于给同一个标签设置了两个相同属性。导致前面的被覆盖掉,所以写在后面。)

<style>
        p{
         font: italic 700 300px 楷体,宋体,隶书,sans-serif;
        }
    </style>
</head>
<body>
    <p>即使放假也不能忘记学习</p>
</body>

  • 0
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值