HTML部分基础

最新推荐文章于 2022-07-27 18:33:48 发布

czhaoxi

最新推荐文章于 2022-07-27 18:33:48 发布

阅读量97

点赞数

本文链接：https://blog.csdn.net/czhaoxi/article/details/104486093

版权

HTML

HTML 超文本标记语言
CSS 层叠样式表
JS（JavaScript）脚本语言

<!DOCTYPE html>     //声明文档
<html lang="en">
<head>
    <meta charset="UTF-8">    //字符编码
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>   //页面标题（收藏夹名字）
</head>
<body>    //页面主体
    
</body>
</html>

块元素与行内元素区别
块元素：
1.单独占一行
2.可以设置所有样式

行内元素（内联元素）：
1.同一行显示
2.部分样式不可以设置
3.宽度和高度由内容撑开

块元素、行内元素、行内块元素相互转换：

.div1{
        display: block;   //转换成块元素
    }
    .div2{
        display: inline;      //转换成行内元素
    }
    .div3{
        display: inline-block;    //转换成行内块元素
    }

CSS层叠样式表

选择器{
		声明1；
		声明2；
	}

声明
属性名：属性值

行内样式

    <div style="background-color: blue">行内样式</div>

内部样式

<style>
        .div1 {
            width: 100px;
            height: 50px;
        }
    </style>

外部样式

<link rel="stylesheet" href="out.css">

JS脚本样式

具有面向对象能力的解释型编程语言
JS三种引入方式
行内式`

<div onclick="alert('hello')">行内式</div>

内嵌式

<script>
        alert('hello')
    </script>    //通常添加在body末尾

外链式

<script src="1.js"> </script>   //外链式脚本块之间的代码不会运行

JS变量

		var name = "朝溪";  //声明一个变量name并且赋值
        console.log(name);  //控制台输出变量name
        name = "朝溪吖";  //给name重新赋值

获取元素绑定事件

var oBox=document.getElementById('box');
        oBox.onclick=function(){
            //时间发生时执行的所有操作
        };

czhaoxi

关注

0
点赞
踩
0

收藏

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

分享到 QQ

分享到新浪微博

扫一扫