zoukankan      html  css  js  c++  java
  • 字体的其他样式

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="UTF-8">
            <title></title>
            <style type="text/css">
                
                .p1{
                    color: red;
                    font-size: 30px;
                    font-family: "微软雅黑";
                    /*
                     * font-style可以用来设置文字的斜体
                     *     - 可选值:
                     *         normal,默认值,文字正常显示
                     *         italic 文字会以斜体显示
                     *         oblique 文字会以倾斜的效果显示
                     *     - 大部分浏览器都不会对倾斜和斜体做区分,
                     *         也就是说我们设置italic和oblique它们的效果往往是一样的
                     *  - 一般我们只会使用italic
                     */
                    font-style: italic;
                    
                    /*
                     * font-weight可以用来设置文本的加粗效果:
                     *         可选值:
                     *             normal,默认值,文字正常显示
                     *             bold,文字加粗显示
                     * 
                     *     该样式也可以指定100-900之间的9个值,
                     *         但是由于用户的计算机往往没有这么多级别的字体,所以达到我们想要的效果
                     *         也就是200有可能比100粗,300有可能比200粗,但是也可能是一样的
                     */
                    font-weight: bold;
                    
                    /*
                     * font-variant可以用来设置小型大写字母
                     *         可选值:
                     *             normal,默认值,文字正常显示
                     *             small-caps 文本以小型大写字母显示
                     * 
                     * 小型大写字母:
                     *         将所有的字母都以大写形式显示,但是小写字母的大写,
                     *             要比大写字母的大小小一些。
                     */
                    font-variant: small-caps ;
                }
                
                .p2{
                    /*设置一个文字大小*/
                    font-size: 50px;
                    /*设置一个字体*/
                    font-family: 华文彩云;
                    /*设置文字斜体*/
                    font-style: italic;
                    /*设置文字的加粗*/
                    font-weight: bold;
                    /*设置一个小型大写字母*/
                    font-variant: small-caps;
                }
                
                .p3{
                    /*
                     * 在CSS中还为我们提供了一个样式叫font,
                     *     使用该样式可以同时设置字体相关的所有样式,
                     *     可以将字体的样式的值,统一写在font样式中,不同的值之间使用空格隔开
                     * 
                     * 使用font设置字体样式时,斜体 加粗 小大字母,没有顺序要求,甚至可写可不写,
                     *     如果不写则使用默认值,但是要求文字的大小和字体必须写,而且字体必须是最后一个样式
                     *     大小必须是倒数第二个样式
                     * 
                     * 实际上使用简写属性也会有一个比较好的性能
                     */
                    font: small-caps bold italic 60px "微软雅黑";
                }
                
                
            </style>
        </head>
        <body>
            
            <p class="p3">我是一段文字,ABCDEFGabcdefg</p>
            
            <p class="p1">我是一段文字,ABCDEFGabcdefg</p>
            
            <p class="p2">我是一段文字,ABCDEFGabcdefg</p>
        </body>
    </html>
  • 相关阅读:
    找出占用磁盘空间最大的前10个文件或文件夹
    把inline函数的定义放在头文件中
    判断是大端字节序还是小端字节序
    在source insight 中添加系统字体
    C++ inline 函数
    标准I/O函数库的三类缓冲
    内存分配失败错误处理
    P1765 手机
    P1321 单词覆盖还原
    P1308 [NOIP2011 普及组] 统计单词数
  • 原文地址:https://www.cnblogs.com/juham/p/14864871.html
Copyright © 2011-2022 走看看