【XHTML&CSS读书笔记】大小写、行高、粗体和斜体

来源：互联网发布：手机淘宝打折编辑：程序博客网时间：2024/06/08 05:50
读《HTML之路》第1、2章笔记
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"><head>    <title>Case, line-height, bold and italics</title>    <style type="text/css" media="all">        body {        /*        font属性的快捷写法：这个属性的值是：        font-style,font-variant,font-weight,font-size,line-height和font-family的组合，        只有font-size和font-family是必须的          */        font: 150% arial, helvetica, sans-serif;    }    /*    id选择符用于唯一地标识文档某部分内容，在HTML文档中，同一个id只能使用一次    这里的#p3是id选择符，通过id将样式绑定到相应的对象上    */     #p3 {        font-variant: small-caps; /*将小写字母转为小个的大写字母*/    }        #p4 {        text-transform: uppercase;/*将小写字母转为大个的大写字母*/    }    /*    class选择符用于标识文档某部分内容，在HTML文档中，同一个class名可以被使用无数次    这里的.p5是class选择符，通过class名将样式绑定到相应的对象上    */    .p5 {        line-height: 5.5;        color: blue;        font-weight: bold;     }    /*    在这里em是HTML选择符，指定一个css规则应用到某个对象上    */    em {         font-style: italic; /* generally unnecessary because the default style of em tends to be italic */    }        strong {        font-weight: bold; /* again unnecessary - the default style of strong tends to be bold */    }        </style></head><body><p id="p3">The <strong>green</strong> seed of the white-flowering climbing leguminous papilionaceous plant, <em>pisum sativum</em>, has become a dining-table favourite for good reason.</p><p id="p4">The <strong>perfect</strong> accompaniment to any meal, the diminutive spherical vegetable brings joy to billions worldwide, be they fresh, frozen, canned or dried.</p><p class="p5">This a wonderful day!</p></body></html>
运行结果：