css如何改变字体粗细

在css中,可以使用font-weight属性改变字体粗细,只需要给字体元素设置“font-weight:数值;”。该属性用于设置显示元素的文本中所用的字体加粗。数字值400相当于关键字normal,700等价于bold。

css如何改变字体粗细

本教程操作环境:windows7系统、CSS3&&HTML5版、Dell G3电脑。

HTML中通过添加标记,或者标记来设置文字的粗细。

CSS可以将文字的粗细进行了细致的划分,而且,还可以将本身是粗体的文字,变为正常的粗细显示。

      文字粗细          h1 span {        font-weight: lighter;      }      span {        font-size: 30px;      }      span.one {        font-weight: 100;      }      span.two {        font-weight: 200;      }      span.three {        font-weight: 300;      }      span.four {        font-weight: 400;      }      span.five {        font-weight: 500;      }      span.sex {        font-weight: 600;      }      span.seven {        font-weight: 700;      }      span.eight {        font-weight: 800;      }      span.nine {        font-weight: 900;      }      span.ten {        font-weight: bold;      }      span.eleven {        font-weight: normal;      }            

文字

    文字粗细:100    文字粗细:200    文字粗细:300    文字粗细:400    文字粗细:500    文字粗细:600    文字粗细:700    文字粗细:800    文字粗细:900    文字粗细:bold    文字粗细:normal  

登录后复制

文字的粗细在CSS中通过属性:font-weight设置,如上代码几乎涵盖了所有的文字粗细值,并且,可以是本身是粗体的字体,变成正常粗体。

立即学习“前端免费学习笔记(深入)”;

推荐学习:css视频教程

以上就是css如何改变字体粗细的详细内容,更多请关注【创想鸟】其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2872483.html

(0)
上一篇 2025年3月10日 18:43:47
下一篇 2025年3月10日 18:43:54

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • css字体图标怎么用

    在css中,将fonts和style.css文件引入后,可以使用行内标签添加字体图标,语法格式为“”。字体图标颜色、大小都可以通过对应的css来修改;文件比较小,利于页面减少http请求。 本教程操作环境:windows7系统、CSS3&a…

    2025年3月10日
    100
  • css上边距怎么写

    在css中,可以使用margin-top属性设置上边距,只需要给元素设置“margin-top:数值+单位;”样式即可。margin-top属性设置元素的上外边距,允许使用负值。 本教程操作环境:windows7系统、CSS3&&a…

    2025年3月10日
    200
  • css中:not用法是什么

    在css中,“:not”是选择器的一种,如果希望某个样式不作用到选择器上,可以使用:not(选择器),语法格式为“ 元素:not(元素id){属性:属性值;}”;该选择器匹配非指定元素/选择器的每个元素。 本教程操作环境:windows7系…

    2025年3月10日
    200
  • css怎么让背景图拉伸

    在css中,可以使用background-size属性让背景图拉伸,只需要给元素设置“background-size:100% 100%;”样式即可。该属性可以以父元素的百分比来设置背景图像的宽度和高度。 本教程操作环境:windows7系…

    2025年3月10日
    200
  • 利用CSS如何实现全兼容的毛玻璃效果?(代码详解)

    本篇文章带大家了解一下css backdrop-filter属性,看看该属性的兼容性,介绍一下如何实现全兼容毛玻璃效果。 通过本文,你能了解到 最基本的使用 CSS backdrop-filter 实现磨砂玻璃(毛玻璃)的效果 在至今不兼容…

    2025年3月10日 编程技术
    200
  • 详解CSS content的使用机制,原来还可以这样用!

    本篇文章带大家了解一下css中的content属性,介绍一下content的使用场景,希望对大家有所帮助! 在开发中遇到类似清除浮动、小图标、替换内容等场景时不可避免会遇到 content 属性,一般就是百度下解决方案,甚少细究到底,在看《…

    2025年3月10日 编程技术
    200
  • CSS怎么设置字体发光效果

    在CSS中,可以利用text-shadow属性来设置字体发光效果;该属性可为文本添加阴影效果,设置阴影的水平偏移量和垂直偏移量为0,增大阴影模糊的距离,即可以达到字体外发光的效果。 本教程操作环境:windows7系统、CSS3&&…

    2025年3月10日
    200
  • css怎么把ul文字变成横向排列

    在css中,可以利用float属性来把ul文字变成横向排列,只需要给ul列表的li元素添加“float:left;”样式,让li元素往左浮动即可。 本教程操作环境:windows7系统、CSS3&&HTML5版、Dell G…

    2025年3月10日
    200
  • css技巧:怎么给图片添加蒙版(分享)

    之前的文章《什么是CSS语法?详细介绍使用方法及规则》中带了解CSS语法使用方法及规则。下面本篇文章给大家分享一下使用CSS给图片添加蒙版效果的小技巧,这个技巧很实用,可以将帮助您打破网站布局的模式,只需几行代码,快来看看吧! 添加蒙版 遮…

    2025年3月10日
    200
  • css如何重叠图片

    css重叠图片的方法:先通过给图片添加“position: absolute;”样式进行绝对定位;然后使用margin-left和margin-top属性设置图片位置即可。 本教程操作环境:windows7系统、CSS3&&…

    2025年3月10日
    200

发表回复

登录后才能评论