20240309web前端

作业三：古诗词

成果展示：

完整代码：

    
    
    将进酒


    将进酒
    君不见黄河之水天上来

        君不见黄河之水天上来，奔流到海不复回。

        君不见高堂明镜悲白发，朝如青丝暮成雪。

        人生得意须尽欢，莫使金樽空对月。

        天生我材必有用，千金散尽还复来。

        烹羊宰牛且为乐，会须一饮三百杯。

        岑夫子，丹丘生，将进酒，杯莫停。

        与君歌一曲，请君为我侧耳听。

        钟鼓馔玉不足贵，但愿长醉不复醒。

        古来圣贤皆寂寞，惟有饮者留其名。

        陈王昔时宴平乐，斗酒十千恣欢谑。

        五花马，千金裘，

        呼儿将出换美酒，与尔同销万古愁。

解析：

古诗词网页主要是文字标签和图片标签的使用使，使用font-size改变文字的字号大小，line-height调整文字上下的间距，b标签给文字加粗

    将进酒
    君不见黄河之水天上来

img标签插入图片，src写入图片来源路径

由题，需要文字与图片平行显示，首先要将图片调整成左浮动的属性，float属性指定了元素的浮动方式，float:left表示将图像左浮动。左浮动意味着图像会尽量向左边对齐，并腾出周围的空间，其他内容（例如文本）会围绕图像来显示。

正文部分，调整字号大小，文字的上下边距，使其与图片平行显示，内容部分注意换行

    

        君不见黄河之水天上来，奔流到海不复回。

        君不见高堂明镜悲白发，朝如青丝暮成雪。

        人生得意须尽欢，莫使金樽空对月。

        天生我材必有用，千金散尽还复来。

        烹羊宰牛且为乐，会须一饮三百杯。

        岑夫子，丹丘生，将进酒，杯莫停。

        与君歌一曲，请君为我侧耳听。

        钟鼓馔玉不足贵，但愿长醉不复醒。

        古来圣贤皆寂寞，惟有饮者留其名。

        陈王昔时宴平乐，斗酒十千恣欢谑。

        五花马，千金裘，

        呼儿将出换美酒，与尔同销万古愁。