问题遇到的现象和发生背景 学习中,想制作一个简单的页面,中间一行文字在屏幕右向左移动,鼠标点击页面任意位置弹出消息框,比如弹出消息框显示‘请勿触碰’,但是这一步不明白怎么实现。
问题相关代码,请勿粘贴截图
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>警告</title>
<style type="text/css">
p {
font-size: 150px;
color: #FF0000;
}
</style>
</head>
<body>
<marquee>
<div id="div1">
<p>请勿触碰键盘鼠标!!!</p>
</div>
</marquee>
<style>
#div1 {
width: 400px;
height: 400px;
/* 设置容器的宽高 */
margin: 100px auto;
/* 使容器水平边距自动相等 */
/* border: 1px solid red; */
/* 给文本加上边框可以更清楚地看到效果 */
line-height: 400px;
/*设置line-height与rongqi的height相等*/
text-align: left;
/*设置文本水平居中*/
/* overflow: hidden; */
/*防止内容超出容器或者产生自动换行*/
</style>
<style type="text/css">
body {
background-color: #000000;
}
</style>
</body>
</html>