HTML5+CSS3+移动web——CSS 文字控制属性

系列文章目录

HTML5+CSS3+移动web——HTML 基础-CSDN博客icon-default.png?t=N7T8https://blog.csdn.net/ymxk2876721452/article/details/136070953?spm=1001.2014.3001.5502HTML5+CSS3+移动web——列表、表格、表单-CSDN博客icon-default.png?t=N7T8https://blog.csdn.net/ymxk2876721452/article/details/136221443?spm=1001.2014.3001.5502HTML5+CSS3+移动web——CSS基础-CSDN博客icon-default.png?t=N7T8https://blog.csdn.net/ymxk2876721452/article/details/136465434?spm=1001.2014.3001.5502


目录

系列文章目录

一、字体大小

二、字体样式(倾斜)

三、行高

四、设置字体

五、font复合属性

六、文本缩进

七、文本对齐方式

八、文本修饰线


一、字体大小

  • 属性名:font-size

  • 属性值:文字尺寸,PC 端网页最常用的单位 px

p {
  font-size: 30px;
}

二、字体样式(倾斜)

作用:清除文字默认的倾斜效果

属性名:font-style

属性值

  • 正常(不倾斜):normal

  • 倾斜:italic

三、行高

作用:设置多行文本的间距

属性名:line-height

属性值:数字 + px

四、设置字体

属性名:font-family

属性值:字体名

font-family: 楷体;

font-family属性值可以书写多个字体名,各个字体名用逗号隔开,执行顺序是从左向右依次查找

五、font复合属性

用于设置网页文字公共样式,其中字号和字体值必须书写,否则 font 属性不生效 。

复合属性:属性的简写方式,一个属性对应多个值的写法,各个属性值之间用空格隔开。

font: 是否倾斜 是否加粗 字号/行高 字体(必须按顺序书写)

div {
  font: italic 700 30px/2 楷体;
}

六、文本缩进

属性名:text-indent

属性值:

  • 数字 + px

  • 数字 + em(推荐:1em = 当前标签的字号大小

p {
  text-indent: 4em;
}

七、文本对齐方式

用于控制内容水平对齐方式

属性名: text-align

属性值:

  • left 左对齐
  • center 居中对齐
  • right 右对齐

text-align: center;

八、文本修饰线

属性名: text-decoration

属性值:

  • none 无
  • underline 下划线
  • line-through 删除线
  • overline 上划线

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/536045.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

全球首个AI程序员Devin诞生,真的不再需要程序员了吗?

前言 今年到底是怎么回事?前有Sora(首个文生视频大模型)独领风骚,后有Mistral(号称世界第二语言大模型)横刀立马,甚至Claude3的热度都还没有过,今天一则更炸裂的消息就爆出,世界上第一个AI程序…

反无人机电子护栏:原理、算法及简单实现

随着无人机技术的快速发展,其在航拍、农业、物流等领域的应用日益广泛。然而,无人机的不规范使用也带来了安全隐患,如侵犯隐私、干扰航空秩序等。为了有效管理无人机,反无人机电子护栏技术应运而生。 目录 一、反无人机电子护栏…

Docker安装Prometheus监控

环境初始化 关闭防火墙 setenforce 0 vim /etc/selinux/config ##################内部代码################### SELINUXdisabled #关闭防火墙 ############################################ 安装docker #卸载yum源之前的docker安装包 sudo yum remove docker docker-clie…

前端请求到 SpringMVC 的处理流程

1. 发起请求 客户端通过 HTTP 协议向服务器发起请求。 2. 前端控制器(DispatcherServlet) 这个请求会先到前端控制器 DispatcherServlet,它是整个流程的入口点,负责接收请求并将其分发给相应的处理器。 3. 处理器映射&#xf…

深入理解Vue3中利用mitt:实现轻量级事件监听与触发

在 Vue3 中,父组件和子组件之间可以通过一些方式进行通信。其中,父组件向子组件通信主要有两种方式:传值和调用子组件的方法。 一、父组件向子组件传值 当父组件需要向子组件传递数据时,可以通过属性绑定的方式来实现。父组件可…

【平芯微PW2153A】100V宽压降芯片,100W输出,短路保护,性能卓越

在电子设备日新月异的今天,电源管理芯片作为电子设备的“心脏”,其性能的稳定性和高效性对于设备的整体运行至关重要。PW2153A作为一款宽电压范围降压型DC-DC电源管理芯片,凭借其出色的性能和丰富的功能,在电源管理领域大放异彩。…

集智书童 | 炸裂 !轻量化YOLO | ShuffleNetv2与Transformer结合,重塑YOLOv7成就超轻超快YOLO

本文来源公众号“集智书童”,仅用于学术分享,侵权删,干货满满。 原文链接:炸裂 !轻量化YOLO | ShuffleNetv2与Transformer结合,重塑YOLOv7成就超轻超快YOLO 随着移动计算技术的迅速发展,在移动…

Vulnhub靶机:Kioptrix_Level1.1

一、介绍 运行环境:Virtualbox 攻击机:kali(192.168.56.101) 靶机:Kioptrix_Level1.1(192.168.56.104) 目标:获取靶机root权限和flag 靶机下载地址:https://www.vul…

Linux 动态库和静态库 【详解】

动静态库的基本原理 静态库(.a):程序在编译链接的时候把库的代码链接到可执行文件中。程序运行的时候将不再需要静态库动态库(.so):程序在运行的时候才去链接动态库的代码,多个程序共享使用库的…

【数据结构】二叉树OJ题目

965. 单值二叉树 如果二叉树每个节点都具有相同的值,那么该二叉树就是单值二叉树。 只有给定的树是单值二叉树时,才返回 true;否则返回 false。 示例 1: 输入:[1,1,1,1,1,null,1] 输出:true示例 2&#x…

WPF(1)的MVVM的数据驱动学习示例

MVVM Model:数据模型、View 界面、ViewModel 业务逻辑处理 项目结构 界面数据绑定 <Window x:Class"WpfApp1.MainWindow"xmlns"http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x"http://schemas.microsoft.com/winfx/2006/x…

springboot268码头船只货柜管理系统

码头船只出行和货柜管理系统的设计与实现 摘要 针对于码头船只货柜信息管理方面的不规范&#xff0c;容错率低&#xff0c;管理人员处理数据费工费时&#xff0c;采用新开发的码头船只货柜管理系统可以从根源上规范整个数据处理流程。 码头船只货柜管理系统能够实现货柜管理…