在网页DIV中设置一首四行唐诗，并完成相应操作

最新推荐文章于 2024-01-03 19:21:02 发布

大杯柠檬水吖

最新推荐文章于 2024-01-03 19:21:02 发布

阅读量1.1k

点赞数

文章标签： css jquery javascript

本文链接：https://blog.csdn.net/weixin_45773291/article/details/116360216

版权

在网页DIV中设置一首四行唐诗，并完成相应操作
要求：
在网页DIV（自定义宽和高，设置边框，DIV在页面中居中）中设置一首四行唐诗（有标题和作者），在DIV下方设置一个select组件，其中设置三种颜色（颜色自定义）。使用jQuery进行如下操作：
1、在标题上绑定双击事件，每一次双击标题时将最后一行复制一份放置在诗的第一行前面，在操作2次后解除绑定；
2、在诗的第一行上绑定hover()函数，鼠标进入时页面背景设为浅蓝色和诗的字体设置为“楷体”，鼠标离开时设置背景为浅绿色和诗的字体设置为“黑体”；
3、选择select中某一种颜色设置为DIV的背景色。
效果展示：
1、在这里插入图片描述 2、
3、
源代码：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
		<style type="text/css">
			*{
   
				margin: 0rem;
				padding: 0rem;
				text-align: center;
			}
			#cantent{
   
				width: 25rem;
				height: 15rem;
				margin: 50px auto;
				border: 1px solid deepskyblue;
				text-align:

最低0.47元/天解锁文章

大杯柠檬水吖

关注

0
点赞
踩
4

收藏

觉得还不错? 一键收藏
0
评论
在网页DIV中设置一首四行唐诗，并完成相应操作

在网页DIV中设置一首四行唐诗，并完成相应操作要求：在网页DIV（自定义宽和高，设置边框，DIV在页面中居中）中设置一首四行唐诗（有标题和作者），在DIV下方设置一个select组件，其中设置三种颜色（颜色自定义）。使用jQuery进行如下操作：1、在标题上绑定双击事件，每一次双击标题时将最后一行复制一份放置在诗的第一行前面，在操作2次后解除绑定；2、在诗的第一行上绑定hover()函数，鼠标进入时页面背景设为浅蓝色和诗的字体设置为“楷体”，鼠标离开时设置背景为浅绿色和诗的字体设置为“黑体”；3、
复制链接

扫一扫