当前位置: 首页 > news >正文

项目五 李白个人生平(资源)

     本项目旨在能够灵活运用整章知识点设计页面。本项目创建了“唐朝诗人群像”网站的第三个页面——即李白个人生平页面,主要完成其 HTML部分。

【项目目的】

  • 灵活运用HTML 基本标记。
  • 掌握在 HTML页面中嵌入多媒体对象的方法。

【项目内容】

  • 利用HTML标记对网页进行结构化。
  • 能够合理的划分网页结构。

【项目步骤】

        本项目素材包括音频、图片和文本,新建 HTML 文件,命名为 libai-experiencel.html。

将“李白生平经历素材.txt” 文件的所有内容粘贴到<body>标记间。

1.网页总体结构化

素材“李白生平经历素材.tx”文件分为13个部分,见注释。分别是 !--header-->、<!-背景音乐 ->、<!--标题李白-->、 !--页面尾部-->、<!--1导读-->.••<!--10story故事3-->。在本部分做页面结构化是为了在后续项目中进行页面布局,参照项目图5-1所

(1) <header>及<nav>标签:页面头部将作为页面的主导航,因此将注释中页面头部的

"首页.•调查问卷”内容添加到指定标签内。

(2) <aside> 标签:将注释背景音乐部分,即文字〝背景音乐”,将添加到<aside>标签

内。此部分将作为背景音乐。

(3) <main>标签:此部分包括了从“1导读—10 故事3”的十个主题,将其加入到

<main>标签中。主体 main 将划分为两个部分,分别是 content 和 aside。

  1. <div id="content”>:根据注释,将“标题李白—7 当涂”划分到此部分。
  2. <aside id="story”>:根据注释,“a 故事1—10 故事3” 划分到此部分。
  3. <div id="daodu”>:根据注释,“1导读”划分到此部分。

项目图5-1网页总体结构划分

2.网页细分
(1)划分<header>细分:此部分用来做主导航,所以需要用<nav>、<ul>、<li>标签将
header部分划分为导航和列表,请参照项目图5-2所示进行结构化。

                                           

相关文章:

项目五 李白个人生平(资源)

本项目旨在能够灵活运用整章知识点设计页面。本项目创建了“唐朝诗人群像”网站的第三个页面——即李白个人生平页面,主要完成其 HTML部分。 【项目目的】 灵活运用HTML 基本标记。掌握在 HTML页面中嵌入多媒体对象的方法。【项目内容】 利用HTML标记对网页进行结…...

计算机视觉与各个学科融合:探索新方向

目录 引言计算机视觉与其他学科的结合 与医学的结合与机械工程的结合与土木工程的结合与艺术与人文的结合发文的好处博雅知航的辅导服务 引言 计算机视觉作为人工智能领域的重要分支&#xff0c;正迅速发展并渗透到多个学科。通过与其他领域的结合&#xff0c;计算机视觉不仅…...

数据分析类论文通过stata进行数据预处理(一)

一&#xff1a;导入数据 打开Stata命令窗口&#xff0c;输入以下命令&#xff1a; use "文件路径\数据文件名.dta", clear其中&#xff0c;.dta是Stata的数据文件格式。clear选项用于在打开新数据文件前关闭当前数据集。 以下是一些导入不同格式数据的方法&#x…...

力扣——1.返回字符串中第一个唯一的字符;2.把字符串转换成整数(C++)

1.返回字符串中第一个唯一的字符 1.1题目描述 给定一个字符串s &#xff0c;找到它的第一个不重复的字符&#xff0c;并返回它的索引 。如果不存在&#xff0c;则返回 -1 。 示例&#xff1a; 1.2思路 这里提供两种思路&#xff1a;第一种是利用哈希表&#xff0c;先遍历一…...

M-LAG【根桥方式】

1.M-LAG不是有单向隔离机制天然防环吗&#xff0c;为什么还要使用STP&#xff1f; 答&#xff1a;因为M-LAG设备下面不是只接服务器&#xff0c;也不是和所有下联设备组成M-LAG&#xff0c;和没有组成M-LAG的设备可能会造成环路。 2.为什么要关闭peer-link接口的生成树计算&a…...

新书速览|循序渐进Node.js企业级开发实践

《循序渐进Node.js企业级开发实践》 1 本书内容 《循序渐进Node.js企业级开发实践》结合作者多年一线开发实践&#xff0c;系统地介绍了Node.js技术栈及其在企业级开发中的应用。全书共分5部分&#xff0c;第1部分基础知识&#xff08;第1&#xff5e;3章&#xff09;&#xf…...

Xlsxwriter生成Excel文件时TypeError异常处理

在使用 XlsxWriter 生成 Excel 文件时&#xff0c;如果遇到 TypeError&#xff0c;通常是因为尝试写入的值或格式与 XlsxWriter 的限制或要求不兼容。 1、问题背景 在使用 Xlsxwriter 库生成 Excel 文件时&#xff0c;出现 TypeError: “expected string or buffer” 异常。此…...

【NLP高频面题 - LLM架构篇】大模型使用SwiGLU相对于ReLU有什么好处?

【NLP高频面题 - LLM架构篇】大模型使用SwiGLU相对于ReLU有什么好处&#xff1f; 重要性&#xff1a;★★★ &#x1f4af; NLP Github 项目&#xff1a; NLP 项目实践&#xff1a;fasterai/nlp-project-practice 介绍&#xff1a;该仓库围绕着 NLP 任务模型的设计、训练、优化…...

2021 年“泰迪杯”数据分析技能赛B 题肥料登记数据分析

2021 年“泰迪杯”数据分析技能赛B 题肥料登记数据分析 完整代码请私聊 博主 # 一、背景 肥料是农业生产中一种重要的生产资料&#xff0c;其生产销售必须遵循《肥料登记管理办法》&#xff0c;依法在农业行政管理部门进行登记。各省、自治区、直辖市人民政府农业行政主管部门主…...

网络原理之 IP 协议

目录 1. IP 协议报文格式 2. 网段划分 3. 地址管理 1) 动态分配 2) NAT 机制 (网络地址转换) 3) IPv6 4. 路由选择 1. IP 协议报文格式 IP 协议是网络层的重点协议。 网络层要做的事情&#xff0c;主要就是两方面&#xff1a; 1) 地址管理 制定一系列的规则&#xff…...

在 Spring Boot 项目中使用 Thymeleaf 时,通常情况下,你需要配置热加载(Hot Reload)来在开发过程中更快速地看到页面的变化。

配置步骤&#xff1a; 1. 添加 DevTools 依赖 在 pom.xml 中添加 spring-boot-devtools 依赖。DevTools 提供了自动重启、LiveReload、模板热加载等功能。 <dependencies><!-- Spring Boot DevTools (用于热加载) --><dependency><groupId>org.spri…...

arm-linux GPIO控制-脚本及shell格式

以下是针对BCM编号27, 28, 29, 30, 31的shell命令 shell方式 导出GPIO引脚 echo 27 > /sys/class/gpio/export echo 28 > /sys/class/gpio/export echo 29 > /sys/class/gpio/export echo 30 > /sys/class/gpio/export echo 31 > /sys/class/gpio/export 设…...

Go 语言基础知识语法

很早听人说过一句话&#xff1a;“每年学习&#xff08;接触&#xff09;一门新的编程语言”&#xff0c;这听起来可能有点不太现实&#xff0c;但是其实很多种语言都是相通的。掌握新的编程语言不仅仅是增加职业工具箱中的工具&#xff0c;更是一种扩展我们思维方式、解决问题…...

贪心算法part05

文章参考来源代码随想录 (programmercarl.com) 56. 合并区间 本题和前几题类似&#xff0c;都是判断上一个元素的右边界与当前元素的左边界大小关系 但是需要注意是&#xff1a;本题需要更新结果数组元素的右边界&#xff0c;因此比较的是数组最后一个元素右边界与当前元素左…...

02、SpringMVC核心(上)

一、RequestMapping注解 @Target({ElementType.TYPE, ElementType.METHOD}) @Retention(RetentionPolicy.RUNTIME) @Documented @Mapping @Reflective({ControllerMappingReflectiveProcessor.class}) public @interface RequestMapping {String name() default "";…...

EasyPlayerPro的同一个组件实例根据url不同展示视频流

效果 学习 url的组成 webrtc://192.168.1.225:8101/index/api/webrtc?applive&stream001&typeplay 协议部分 webrtc://: 这表示使用 WebRTC 协议来进行实时通信。WebRTC 允许浏览器之间直接交换音频、视频和其他数据&#xff0c;而不需要通过中间服务器 主机和端口部分…...

哈希表介绍、实现与封装

哈希表介绍、实现与封装 一、哈希概念二、哈希表实现直接定址法其他映射方法介绍1. 哈希冲突2. 负载因子3. 将关键字转为整数4. 设计哈希函数除法散列法 / 除留余数法乘法散列法全域散列法其他方法 将关键字转为整数处理哈希冲突开放定址法线性探测二次探测双重散列 开放定址法…...

使用vm配置网络

查看本地ip 配置vm网络 配置固定ip vi /etc/sysconfig/network-script/ifcfg-ens33参考 vm使用nat模式&#xff0c;导致vm中docker部署的服务&#xff0c;无法通过局域网中其他机器连接 https://www.cnblogs.com/junwind/p/14345385.html 三张图看懂vm中&#xff0c;三种网…...

OpenStack介绍

OpenStack概述 OpenStack是一个开源的云计算管理平台软件,主要用于构建和管理云计算环境。它允许企业或组织通过数据中心的物理服务器创建和管理虚拟机、存储资源和网络等云计算服务。其核心组件包括计算(Nova)、网络(Neutron)、存储(Cinder、Swift)等。这些组件相互协作…...

力扣93题:复原 IP 地址

力扣93题&#xff1a;复原 IP 地址&#xff08;C语言实现详解&#xff09; 题目描述 给定一个只包含数字的字符串 s&#xff0c;复原它并返回所有可能的 IP 地址格式。 有效的 IP 地址需满足以下条件&#xff1a; IP 地址由四个整数&#xff08;每个整数位于 0 到 255 之间…...

【Linux】shell脚本忽略错误继续执行

在 shell 脚本中&#xff0c;可以使用 set -e 命令来设置脚本在遇到错误时退出执行。如果你希望脚本忽略错误并继续执行&#xff0c;可以在脚本开头添加 set e 命令来取消该设置。 举例1 #!/bin/bash# 取消 set -e 的设置 set e# 执行命令&#xff0c;并忽略错误 rm somefile…...

Qt Widget类解析与代码注释

#include "widget.h" #include "ui_widget.h"Widget::Widget(QWidget *parent): QWidget(parent), ui(new Ui::Widget) {ui->setupUi(this); }Widget::~Widget() {delete ui; }//解释这串代码&#xff0c;写上注释 当然可以&#xff01;这段代码是 Qt …...

UE5 学习系列(三)创建和移动物体

这篇博客是该系列的第三篇&#xff0c;是在之前两篇博客的基础上展开&#xff0c;主要介绍如何在操作界面中创建和拖动物体&#xff0c;这篇博客跟随的视频链接如下&#xff1a; B 站视频&#xff1a;s03-创建和移动物体 如果你不打算开之前的博客并且对UE5 比较熟的话按照以…...

MODBUS TCP转CANopen 技术赋能高效协同作业

在现代工业自动化领域&#xff0c;MODBUS TCP和CANopen两种通讯协议因其稳定性和高效性被广泛应用于各种设备和系统中。而随着科技的不断进步&#xff0c;这两种通讯协议也正在被逐步融合&#xff0c;形成了一种新型的通讯方式——开疆智能MODBUS TCP转CANopen网关KJ-TCPC-CANP…...

【单片机期末】单片机系统设计

主要内容&#xff1a;系统状态机&#xff0c;系统时基&#xff0c;系统需求分析&#xff0c;系统构建&#xff0c;系统状态流图 一、题目要求 二、绘制系统状态流图 题目&#xff1a;根据上述描述绘制系统状态流图&#xff0c;注明状态转移条件及方向。 三、利用定时器产生时…...

汇编常见指令

汇编常见指令 一、数据传送指令 指令功能示例说明MOV数据传送MOV EAX, 10将立即数 10 送入 EAXMOV [EBX], EAX将 EAX 值存入 EBX 指向的内存LEA加载有效地址LEA EAX, [EBX4]将 EBX4 的地址存入 EAX&#xff08;不访问内存&#xff09;XCHG交换数据XCHG EAX, EBX交换 EAX 和 EB…...

HarmonyOS运动开发:如何用mpchart绘制运动配速图表

##鸿蒙核心技术##运动开发##Sensor Service Kit&#xff08;传感器服务&#xff09;# 前言 在运动类应用中&#xff0c;运动数据的可视化是提升用户体验的重要环节。通过直观的图表展示运动过程中的关键数据&#xff0c;如配速、距离、卡路里消耗等&#xff0c;用户可以更清晰…...

【分享】推荐一些办公小工具

1、PDF 在线转换 https://smallpdf.com/cn/pdf-tools 推荐理由&#xff1a;大部分的转换软件需要收费&#xff0c;要么功能不齐全&#xff0c;而开会员又用不了几次浪费钱&#xff0c;借用别人的又不安全。 这个网站它不需要登录或下载安装。而且提供的免费功能就能满足日常…...

STM32---外部32.768K晶振(LSE)无法起振问题

晶振是否起振主要就检查两个1、晶振与MCU是否兼容&#xff1b;2、晶振的负载电容是否匹配 目录 一、判断晶振与MCU是否兼容 二、判断负载电容是否匹配 1. 晶振负载电容&#xff08;CL&#xff09;与匹配电容&#xff08;CL1、CL2&#xff09;的关系 2. 如何选择 CL1 和 CL…...

python爬虫——气象数据爬取

一、导入库与全局配置 python 运行 import json import datetime import time import requests from sqlalchemy import create_engine import csv import pandas as pd作用&#xff1a; 引入数据解析、网络请求、时间处理、数据库操作等所需库。requests&#xff1a;发送 …...