初识网页编程

网页标签

头标签

<title>好好学习前端</title>

网页标题小图片

<link href="1.jpg"   rel="shortcut icon" type="image/x-icon"/>

一级标题

<h1>再谈《战争与和平》：女性人物的美与罪</h1>

二级标题

<h2>一、成长之美：娜塔莎</h2>
<h2>二、肉欲之美：海伦</h2>

段落

  <p>
        海伦和娜塔莎都先后嫁给了同一个男人——皮埃尔，而她们的性格经历，无论哪方面都迥然对立。
  </p>

链接

<a href="https://www.douban.com">“《战争与和平》：反英雄主义的英雄赞歌”</a>

插入图片

<img src="images/002.webp" alt="">

注意：src下写清图片所在目录

换行

<br>

引用

    <blockquote>
            “我不伤心，”我有些言不由衷地说，“谁也不会娶我，我自己也不准备嫁人。”
    </blockquote>

美化文章

github引用美化文章
1.搜索 github markdown css
2.引用HTML链接https://cdnjs.cloudflare.com/ajax/libs/github-markdown-css/2.10.0/github-markdown.css

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/github-markdown-css/2.10.0/github-markdown.css">

3.复制格式

<style>
        .markdown-body {
            box-sizing: border-box;
            min-width: 200px;
            max-width: 980px;
            margin: 0 auto;
            padding: 45px;
        }
    
        @media (max-width: 767px) {
            .markdown-body {
                padding: 15px;
            }
        }
    </style>

4.修改body标签

<body class="markdown-body">

整个网页代码

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>再谈《战争与和平》：女性人物的美与罪</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/github-markdown-css/2.10.0/github-markdown.css">
    <style>
        .markdown-body {
            box-sizing: border-box;
            min-width: 200px;
            max-width: 980px;
            margin: 0 auto;
            padding: 45px;
        }
    
        @media (max-width: 767px) {
            .markdown-body {
                padding: 15px;
            }
        }
    </style>
</head>
<body class="markdown-body">
    <h1>再谈《战争与和平》：女性人物的美与罪</h1>

    <img src="images/001.jpg" alt="">

    <a href="https://www.douban.com">怀璧不与</a>

    2018-03-05 20:44:08<br>

    <img src="images/002.webp" alt=""><br>
    海伦（BBC版）
    <p>
        之前那篇<a href="https://www.douban.com">“《战争与和平》：反英雄主义的英雄赞歌”</a>，我从几位男性人物入手，探讨了托尔斯泰的历史观。这一篇则反行其道，从几位女性人物入手，谈谈托尔斯泰的女性观。
    </p>

    <p>
        值得注意的是，托尔斯泰作为十九世纪的俄国贵族，他对待女性的观点有一些时代的局限性，而他之所以成为世界闻名的文学巨擘，也在于他能够将他不认同或者批判的人物，塑造得活灵活现、扣人心弦，即便在百余年后的今天，仍然具有不可估量的思想价值和艺术魅力。

    </p>

    <h2>一、成长之美：娜塔莎</h2>

    <h2>二、肉欲之美：海伦</h2>
    <img src="images/003.webp" alt="">
    <br>
    海伦与皮埃尔的婚礼
    <br>

    <p>
        海伦和娜塔莎都先后嫁给了同一个男人——皮埃尔，而她们的性格经历，无论哪方面都迥然对立。
    </p>

    <p>
        在娜塔莎还在玩洋娃娃的时候，海伦就已经是上流社会炙手可热的著名美人了。她深知自己的美貌，也乐于在男人们的垂涎追捧和女人们的嫉妒伪善中获得满足，甚至跟自己的亲哥哥阿纳托里有过乱伦的传闻。
    </p>

    <blockquote>
            “我不伤心，”我有些言不由衷地说，“谁也不会娶我，我自己也不准备嫁人。”
    </blockquote>

</body>
</html>

第一个网页制作

第一个网页制作

初识网页编程

网页标签

美化文章

整个网页代码

推荐阅读更多精彩内容