css学习之font与colours(list-style-position)

最新推荐文章于 2024-08-10 21:02:05 发布

happy59

最新推荐文章于 2024-08-10 21:02:05 发布

阅读量543

点赞数

文章标签： css stylesheet html date class 文档

本文链接：https://blog.csdn.net/happy59/article/details/7825984

版权

通用字体有五种：serif / sans-serif / monospace / cursive / fantasy

Serif 字体

这些字体成比例，而且有上下短线。如果字体中的所有字符根据其不同大小有不同的宽度，则成该字符是成比例的。例如，小写 i 和小写 m 的宽度就不同。上下短线是每个字符笔划末端的装饰

Sans-serif 字体这些字体是成比例的，而且没有上下短线。Sans-serif 字体的例子包括 Helvetica、Geneva、Verdana、Arial 或 Univers。感悟： list-style-position:inside规则的使用。列表项目标记放置在文本以内，且环绕文本根据标记对齐实现下图的Html与css文档：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
  "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
    <link rel="stylesheet" type="text/css" href="font.css" />
    <title>CSS Challenge 1</title>
  </head>
  <body>
   <h1>Shakespeare's Sonnet #18</h1>
    <p>
       This is one of the most famous of the sonnets. It is referenced
       in the film Dead Poets Society and gave names to the band The
       Darling Buds and the book and television series The Darling Buds
       of May. Read it and weep!
    </p>
    <ul>
      <li>Shall I compare thee to a summer's day?</li>
      <li>Thou art more lovely and more temperate:</li>
      <li>Rough winds do shake the darling buds of May,</li>
      <li>And summer's lease hath all too short a date:</li>
      <li>Sometime too hot the eye of heaven shines,</li>
      <li>And often is his gold complexion dimm'd,</li>
      <li>And every fair from fair sometime declines,</li>
      <li>By chance, or nature's changing course untrimm'd:</li>
      <li>But thy eternal summer shall not fade,</li>
      <li>Nor lose possession of that fair thou ow'st,</li>
      <li>Nor shall death brag thou wander'st in his shade,</li>
      <li>When in eternal lines to time thou grow'st,</li>
      <li>So long as men can breathe, or eyes can see,</li>
      <li>So long lives this, and this gives life to thee.</li>
    </ul>
      
    <p class="copyright">See the 
    <a href="http://en.wikipedia.org/wiki/Shakespeare%27s_Sonnets">
    Shakespeare's sonnets</a> Wikipedia article for more information
    </p>
  </body>
</html>

body{background:#5B7FBD;margin:10px 20px;font-size:14px;font-family:Arial;color:#222;}
h1{
   font-size:2.5em;
   }
 ul{text-align:center;}
 li{list-style-position:inside;}
 .copyright{font-style:italic;font-size:12px;color:#222;font-family:Arial;}
 .copyright a{color:#750096}

happy59

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
css学习之font与colours(list-style-position)

通用字体有五种：serif / sans-serif / monospace / cursive / fantasy Serif 字体这些字体成比例，而且有上下短线。如果字体中的所有字符根据其不同大小有不同的宽度，则成该字符是成比例的。例如，小写 i 和小写 m 的宽度就不同。上下短线是每个字符笔划末端的装饰Sans-serif 字体这些字体是成比例的，而且没有上下短
复制链接

扫一扫