html基础入门（css，js初步了解）

最新推荐文章于 2024-10-17 15:53:46 发布

Exclusive_Cat

最新推荐文章于 2024-10-17 15:53:46 发布

阅读量414

点赞数 6

文章标签： html css javascript

本文链接：https://blog.csdn.net/2302_80464795/article/details/141180754

版权

大家好我是猫咪！！！

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>

<link rel="stylesheet" href="test.css">
</head>
<body>

<h1 class="qwer">
再测试一下
</h1>
</body>
</html>

然后再创建一个文件，名字叫做test.css

什么是css,css就是用来使得html页面更加美观的配置文件，也就是说用来美化页面的

.qwer{
    font-size: 200px;
    color: red;
    font-family: 楷体;

}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        b{
            font-size: 40px;
        }
    </style>
</head>
<body>

<h1>
    移动鼠标，改变背景颜色
</h1>
<b οnmοuseοver="test('red')">
    红色
</b>
|
<b οnmοuseοver="test('blue')">
    蓝色
</b>
|
<b οnmοuseοver="test('yellow')">
    黄色
</b>
<script>
    function test(c) {
        document.bgColor=c;
    }
</script>
</body>
</html>

将鼠标移到对应的字上时就会改变页面的颜色

在页面上方的标题标签中，指定了页面的标题为"Title"。在页面的内容部分，有一个标题标签"h1"，内容是"移动鼠标，改变背景颜色"。接下来是三个"b"标签，分别是"红色"、"蓝色"和"黄色"。每个"b"标签上增加了一个"onmouseover"事件，当鼠标移动到该元素上时，会调用JavaScript中的"test"函数，并将颜色值作为参数传递给它。在JavaScript中定义了"test"函数，该函数将参数值设置为页面的背景颜色。这样，当鼠标移动到"红色"、"蓝色"或"黄色"上时，页面的背景颜色将分别改变为红色、蓝色或黄色。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<!--onclick表示点击事件-->
<a οnclick="alert('hello')">点击一下</a>

</body>
</html>

点击一下页面中的字，即可弹出警告窗，alert（）括号中的内容是警告窗中的内容

<!DOCTYPE html>

<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<h1>
    测试
</h1>


<script>
    //write用来向页面输出内容
    document.write("hello")
</script>

<h1>
    测试
</h1>
</body>
</html>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<script src="test.js">

</script>
</body>
</html>

document.write("js文件里写的代码");

Exclusive_Cat

关注

6
点赞
踩
10

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫