首页 > 软件开发 > HTML >

字符间距和单词间距 word-spacing

来源:互联网 2023-03-16 19:11:01 150

这里我们讲一下字符间距和单词间距的区别,也顺便讲一下单词间距的用法ghy办公区 - 实用经验教程分享!

工具/原料

  • 电脑
  • Dreamweaver

方法/步骤

  • 1

    字符间距对于我们中文来讲是两个字之间的间隔,如图所示ghy办公区 - 实用经验教程分享!

    字符间距和单词间距 word-spacingghy办公区 - 实用经验教程分享!

  • 2

    对于英文来讲,是单词字母与字母之间的间距ghy办公区 - 实用经验教程分享!

    字符间距和单词间距 word-spacingghy办公区 - 实用经验教程分享!

  • 3

    而如果是单词与单词之间的间距,我们就必须设置word-spacingghy办公区 - 实用经验教程分享!

    语法如下:ghy办公区 - 实用经验教程分享!

    word-spacing:20px;ghy办公区 - 实用经验教程分享!

    字符间距和单词间距 word-spacingghy办公区 - 实用经验教程分享!

  • 4

    在浏览器显示如图所示,是单词之间的间距,不是字母之间的间距关系ghy办公区 - 实用经验教程分享!

    字符间距和单词间距 word-spacingghy办公区 - 实用经验教程分享!

  • 5

    加入现在使用word-spacing来给中文字体设置又会出现什么效果ghy办公区 - 实用经验教程分享!

    代码如下:ghy办公区 - 实用经验教程分享!

    head>ghy办公区 - 实用经验教程分享!

    meta http-equiv="Content-Type" content="text/html; charset=utf-8" />ghy办公区 - 实用经验教程分享!

    title>单词间距/title>ghy办公区 - 实用经验教程分享!

    style>ghy办公区 - 实用经验教程分享!

    p{ghy办公区 - 实用经验教程分享!

    word-spacing:20px;}ghy办公区 - 实用经验教程分享!

    /style>ghy办公区 - 实用经验教程分享!

    /head>ghy办公区 - 实用经验教程分享!

    ghy办公区 - 实用经验教程分享!

    body>ghy办公区 - 实用经验教程分享!

    p id="sa">思念是一种病ghy办公区 - 实用经验教程分享!

    /body>ghy办公区 - 实用经验教程分享!

    字符间距和单词间距 word-spacingghy办公区 - 实用经验教程分享!

  • 6

    浏览器显示的效果ghy办公区 - 实用经验教程分享!

    字符间距和单词间距 word-spacingghy办公区 - 实用经验教程分享!

  • 7

    我们可以看出,letter-spacing字符间距是对英文中文都可以起作用的,对中文是字与字之间的间隔,而对英文是字母与字母之间的间隔ghy办公区 - 实用经验教程分享!

    而word-spacing单词间距是对单词的间距起作用,对中午跟不起作用ghy办公区 - 实用经验教程分享!

  • 7此文章非法爬取自百度经验
  • 注意事项

    • letter-spacing对中文英文都起作用,对中文是字与字之间的间隔,对英文是字母与字母之间的间隔
    • word-spacing单词间隔对中文不起作用,对英文是单词与单词之间的作用

    以上方法由办公区教程网编辑摘抄自百度经验可供大家参考!ghy办公区 - 实用经验教程分享!


    标签: HTML

    办公区 Copyright © 2016-2023 www.bgqu.net. Some Rights Reserved. 备案号:湘ICP备2020019561号统计代码