热门标签 | HotTags
当前位置:  开发笔记 > 前端 > 正文

html5css字体加粗,HTML和CSS实现字体加粗的三种方法

大家在浏览网站时有没有注意到,页面中有些文字或字体加粗了,正在学习HTML和CSS的小伙伴,你知道HTML如何给文字加粗吗?

大家在浏览网站时有没有注意到,页面中有些文字或字体加粗了,正在学习HTML和CSS的小伙伴,你知道HTML如何给文字加粗吗?CSS怎么设置字体加粗呢?这篇文章给大家总结了给字体和文字加粗的三种方法,包括HTML中的加粗标签以及CSS字体加粗样式,有一定的参考价值,感兴趣的朋友可以参考一下。

给字体和文字加粗有三种方法,一种是CSS中的font-weight: bold样式,一种是HTML中的标签,最后一种是HTML中的标签。

方法1:用CSS中font-weight: bold样式给字体加粗

font-weight属性可以设置字体的粗细,当属性值为normal时,表示正常的字体,相当于number为400;当属性值为bold时,可以给字体粗体,相当于number为700,也相当于标签的效果。

实例描述:创建两个p标签,给其中一个标签一个class类名,便于对其进行CSS样式设置。将font-weight: bold属性添加到有类名的p 标签上,对比两个p标签,看看有什么不同,具体代码如下:Html;toolbar:false">

.aa{font-weight: bold;}

床前明月光

低头思故乡

如下图所示,“低头思故乡”这段文字被加粗了。

273645d9777f12da3fc4be12cf433e67.png

方法2:用Html中的加粗标签

标签可以使字体加粗,且所有主流浏览器都支持此方法。

实例描述:直接用Html中的标签,即可实现文字加粗效果,具体代码如下:

床前明月光

疑是地上霜

如图所示,对比p标签和strong标签的内容,发现strong标签的内容加粗了。

c9673e53e9f917d8bc747549843244d4.png

方法3:用Html中的加粗标签

标签可以定义一个粗体的文本,且所有主流浏览器都支持 标签。

实例描述:标签和标签一样,都可以给文字加粗,并且使用简单方便,具体代码如下:

床前明月光

举头望明月

如下图所示,b标签的里面的文字加粗了

c447a650501414e7500f3cc4652aa46d.png

总结:以上给大家介绍了给文字加粗的三种方法,分别是CSS中的font-weight: bold样式和HTML中的标签、标签,直接用Html标签比较方便,至于选择哪种方法,还要看个人习惯和工作需要,希望这篇文章对你有所帮助!

【相关教程推荐】

3. HTML在线手册

5/19952.html

转载请注明出处。



推荐阅读
  • 本文旨在回顾并总结近期学习的.NET Core基础知识,通过具体的操作指南加深理解,并为初学者提供实用建议,避免常见的错误和陷阱。内容涵盖CentOS的安装配置、.NET Core环境搭建及网站部署等。 ... [详细]
  • Servlet过滤器入门:实现与配置
    本文介绍如何在Java Web应用中实现和配置Servlet过滤器,通过实现`javax.servlet.Filter`接口来创建过滤器,并详细说明其在web.xml文件中的配置方法。 ... [详细]
  • 深入解析Spring Boot自动配置机制
    本文旨在深入探讨Spring Boot的自动配置机制,特别是如何利用配置文件进行有效的设置。通过实例分析,如Http编码自动配置,我们将揭示配置项的具体作用及其背后的实现逻辑。 ... [详细]
  • 传送门A-Registration#include#definelllonglongusingnamespacestd;chars[15],t[15]; ... [详细]
  • 本文探讨了2019年前端技术的发展趋势,包括工具化、配置化和泛前端化等方面,并提供了详细的学习路线和职业规划建议。 ... [详细]
  • 本题要求计算给定两个正整数a和b时,2的-a次方与2的-b次方之和,并将结果以最简分数形式表示。输入包括多组测试数据,每组数据包含两个在2到20范围内的整数。 ... [详细]
  • 在本问题中,游戏的每一步状态均可以视为原始序列的一个子序列。通过定义一个动态规划函数 d(i, j),表示在最优策略下,先手玩家从原序列的第 i 个元素到第 j 个元素之间所能获得的最大分数。 ... [详细]
  • 深入理解动态链接库及其应用
    本文将探讨动态链接库的基本概念,包括Windows下的动态链接库(DLL)和Linux下的共享库(Shared Library),并详细介绍如何在Linux环境中创建和使用这些库。 ... [详细]
  • 理解文档对象模型(DOM)
    本文介绍了文档对象模型(DOM)的基本概念,包括其作为HTML文档的节点树结构,以及如何通过JavaScript操作DOM来实现网页的动态交互。 ... [详细]
  • CentOS 7.2 配置防火墙端口开放
    本文介绍如何在 CentOS 7.2 系统上配置防火墙以开放特定的服务端口,包括 FTP 服务的临时与永久开放方法,以及如何验证配置是否生效。 ... [详细]
  • 本文介绍了如何利用Java中的URLConnection类来实现基本的网络爬虫功能,包括向目标网站发送请求、接收HTML响应、解析HTML以提取所需信息,并处理可能存在的递归爬取需求。 ... [详细]
  • 本文详细介绍了Java集合框架中的Collection体系,包括集合的基本概念及其与数组的区别。同时,深入探讨了Comparable和Comparator接口的区别,并分析了各种集合类的底层数据结构。最后,提供了如何根据需求选择合适的集合类的指导。 ... [详细]
  • 优化Input Checkbox与Label文本对齐的方法
    本文探讨了在网页设计中,如何有效解决input checkbox与label文字不对齐的问题。通过具体的代码实例和解决方案,帮助开发者实现更加美观的用户界面。 ... [详细]
  • 深入解析IGMP各版本特性及其演进
    本文详细探讨了Internet组管理协议(IGMP)的不同版本,包括IGMPv1的基础功能、IGMPv2的增强特性和IGMPv3的重要改进。特别分析了IGMPv3如何支持特定源组播(SSM)模型,并介绍了各版本之间的主要差异。 ... [详细]
  • YB02 防水车载GPS追踪器
    YB02防水车载GPS追踪器由Yuebiz科技有限公司设计生产,适用于车辆防盗、车队管理和实时追踪等多种场合。 ... [详细]
author-avatar
zhaiweibubu
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有