HTML&CSS基础-字体的其它样式

　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　作者：尹正杰

版权声明：原创作品，谢绝转载！否则将追究法律责任。

一.HTML源代码

<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title>字体的其它样式</title>

        <style type="text/css">

            .hello{

                /**

                 *     设置字体颜色，使用color来设置文字的颜色

                 */

                color: red;

                /**

                 *     设置文字的大小，浏览器中一般默认的文字大小都是16px

                 */

                font-size: 30px;

                /**

                 *     通过font-family可以指定文字的字体

                  */

                font-family: arial,"华文彩云","微软雅黑",serif;

                /**

                 *     font-style可以用来设置文字的斜体，有以下可选值:

                 *         normal:

                 *             默认值，文字正常显示

                 *         italic:

                 *             文字会以斜体显示

                 *         oblique:

                 *             文字会以倾斜的效果显示

                 *

                 *     大部分浏览器都不会对倾斜和斜体做区分，也就是说我们设置italic和oblique它们的效果往往是一样的，一般我们只会使用italic

                 *

                 */

                font-style: oblique;

                /**

                 *     font-weight可以用来设置文本的加粗效果，有以下可选值:

                 *         normal:

                 *             默认值，文字正常显示

                 *         bold:

                 *             文字加粗显示

                 *

                 *         该样式也可以看指定100-900之间的9个值，但是由于用户计算机往往没有这么多级别的字体，所以达到为我们想要的效果也就是200有可能比100粗，300有可能比200粗，但是也可能是一样的。

                 */

                font-weight: bold;

                /**

                 *     font-variant可以用来设置小型大写字母,可选值:

                 *         normal:

                 *             默认值，文字正常显示

                 *         small-caps:

                 *             文本以小型大写字母显示

                 *

                 *     小型大写字母:

                 *         所有的字母都以大写形式显示，但是小写字母的大写要比大写字母的大写要小一些。

                 *

                 */

                font-variant: small-caps;

            }    

            .world{

                /**

                 *     设置文字的大小，浏览器中一般默认的文字大小都是16px

                 */

                font-size: 50px;

                /**

                 *     通过font-family可以指定文字的字体

                  */

                font-family:"华文彩云",serif;

                /**

                 * 设置文字的斜体

                 */

                font-style: italic;

                /**

                 *     设置文字的加粗

                 */

                font-weight: bold;

                /**

                 *     设置一个小型大写字母

                 */

                font-variant: small-caps;

            }

            .python{

                /**

                 *     在CSS中还为我们提供了一个样式叫font，使用该样式可以同时设置字体相关的样式

                 *         可以将字体样式的值，统一写在font样式中，不同的值之间使用空格隔开

                 *

                 *     使用font设置字体样式时，斜体，加粗，小型大写字母，没有顺序要求，甚至可以不写。

                 *         如果不写则使用默认值，但是要求文字的大小和字体必须写，而且字体必须是最后一个样式，小型大写字母不写则已，若写则必须是倒数第二个样式

                 *

                 *     实际上使用简写属性也会有一个比较好的性能，因为使用font-size，font-family，font-style，font-weight，font-variant设置时需要解析5次，而font则需要解析一次即可。

                 */

                font: italic small-caps bold 70px "微软雅黑";

            }

        </style>

    </head>

    <body>

        <p class="hello">我是p标签，ABCDEFGabcdefg</p>

        <p class="world">我是p标签，ABCDEFGabcdefg</p>

        <p class="python">我是p标签，ABCDEFGabcdefg</p>

    </body>

</html>

二.浏览器打开以上代码渲染结果

strace常用参数详解的更多相关文章

  1. chattr的常用参数详解

    chattr的常用参数详解 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 在实际生产环境中,有的运维工程师不得不和开发和测试打交道,在我们公司最常见的就是部署接口.每天每个人部署的 ...

  2. find常用参数详解

    find常用参数详解 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 在linux系统中,在init 3模式情况下都是命令行模式,这个时候我们想要找到一个文件的就得依赖一个非常好用的 ...

  3. cat常用参数详解

    cat常用参数详解 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 最近,我的一个朋友对linux特别感兴趣,于是我觉得每天交给他一个命令的使用,这样一个月下来也会使用30个命令,基 ...

  4. rsync常用参数详解

    rsync常用参数详解 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 在linux中,一切皆是文件,包括你的终端,硬件设备信息,目录,内核文件等等.所以工作中我们难免会遇到拷贝文件 ...

  5. Nginx核心配置文件常用参数详解

    Nginx核心配置文件常用参数详解 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 关于Nginx权威文档的话童鞋们可以参考Nginx官方文档介绍:http://nginx.org/ ...

  6. nmap常用参数详解

    nmap常用参数详解 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 借用英雄联盟的一个英雄赵信的一句话:“即使敌众我寡,末将亦能万军丛中取敌将首级!”.三国关羽,万军丛中斩了颜良, ...

  7. free命令常用参数详解

    free命令常用参数详解 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 在运维期间我们会经常去查看服务器硬件信息,比如说内存,大家可能知道看内存用“[root@yinzhengji ...

  8. tcpdump常用参数详解

    tcpdump常用参数详解 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 好久没有更新我的博客了,看来自己最近还没有在放假中回过神来啊,哈哈~是不是也有小伙伴跟我一样呢?回归正题, ...

  9. DB2创建数据库常用参数详解

    转自http://czmmiao.iteye.com/blog/1335801 DB2创建数据库常用参数详解 本文只介绍DB2 create database语法中的常用参数http://publib ...

随机推荐

  1. <构建之法>10,11,12章的读后感

    第十章:典型用户和场景 问题 :什么是典型用户? 第十一章:软件设计与实现 问题 :开发人员的标准工作流程就是不断的发现BUg,修改bug来完善功能,在此过程中要等待同伴复审,在这阶段中,开发者应该如 ...

  2. [Intellij IDEA]_eclipse项目导入

    http://www.cnblogs.com/lindp/p/4484390.html

  3. centos7编译安装zabbix(附带编译安装lnmp)

    先把防火墙和selinux关闭: sytemctl stop firewalld setenforce 0 1.yum安装依赖: yum -y install wget openssl* gcc gc ...

  4. Using svn in CLI with Batch

    del %~n0.txt@echo offsetlocal EnableDelayedExpansionfor /f "delims=" %%i in ('DIR /A:D /B' ...

  5. 学习 已经登录windows的情况下获取windows的密码

    官网 http://blog.gentilkiwi.com/mimikatz 下载地点 https://github.com/gentilkiwi/mimikatz/releases/latest 使 ...

  6. php的一些算法题

    1.有一对兔子,从出生后第3个月起每个月都生一对兔子,小兔子长到第三个月后每个月又生一对兔子,假如兔子都不死,请编程输出两年内每个月的兔子总数为多少? <?php function getRes ...

  7. KNN python实践

    本文实现了一个KNN算法,准备用作词频统计改进版本之中,这篇博文是从我另一个刚开的博客中copy过来的. KNN算法是一个简单的分类算法,它的动机特别简单:与一个样本点距离近的其他样本点绝大部分属于什 ...

  8. Highcharts之折线图

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  9. BZOJ4946 NOI2017蔬菜（贪心+堆）

    容易想到一个费用流做法:将每种蔬菜拆成p种,对应p个过期时间,每一种向可以卖的时间连边,第一次卖的奖励算在最晚过期的一种里.对于天数动态加点.不过这样边数太多了,因为第i天能卖的第i-1天一定能卖,可 ...

  10. Ant Trip HDU - 3018（欧拉路的个数 + 并查集）

    题意: Ant Tony和他的朋友们想游览蚂蚁国各地. 给你蚂蚁国的N个点和M条边,现在问你至少要几笔才能所有边都画一遍.(一笔画的时候笔不离开纸) 保证这M条边都不同且不会存在同一点的自环边. 也就 ...