皮皮鲁儿童安全百科

题目:

       设计一个页面,达到如图所示的文字效果



代码:

html:

<!doctype html>

<html>

<head>

    <meta charset="UTF-8">

    <title>皮皮鲁送你100条命儿童安全百科</title>

    <link rel="stylesheet" href="./css/fontstyle.css">

</head>

<body>

    <p>皮皮鲁送你100条命儿童安全百科<p>

    <p class="tip">(1-8辑,全16册)<p>

    <p class="price">¥290.80<p>

    <p class="oprice">476.80<p>

</body>

</html>


css:

p.tip

{

    text-indent: 12px;

}

p.price

{

    font-size:20px;

    color:#900;

    font-weight:bold;

}

p.oprice

{

    text-decoration:line-through;

    color:#808080;

}



运行结果:

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 不会用代码框,所以看着有些乱套,,,,html部分 <!DOCTYPE html> 迅雷看看 ...
    这就是个帅气的名字阅读 1,560评论 0 0
  • 1.块级元素和行内元素 块级(block-level)元素;行内(内联、inline-level)元素。 块元素的...
    饥人谷_小侯阅读 2,038评论 1 4
  • 本书介绍 你是不是对Django的学习感到迷茫?是不是对网上零星的教程感到绝望?是不是苦于没有可以迅速上手的实例而...
    阡陌3536阅读 1,332评论 0 0
  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,792评论 1 92
  • ——下笔前,我先这下我此刻的状态。现在是凌晨,我带上了耳机,音量调到最低,里面是自由播放的许嵩的歌曲。为...
    墨尔本晴_a8c6阅读 429评论 0 1