bmy/ClassContent
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

first commit

Browse Source
This commit is contained in:
编码猿
2024-09-27 02:06:13 +08:00
commit 852d94fbb9
36760 changed files with 3274413 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

49
历届学生/罗朝/2019-04-03/box.html Normal file
View File

@@ -0,0 +1,49 @@
<!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>
<style>
.box {
width: 150px;
height: 150px;
background: red;
/* padding: 10px; */
/* padding: 10px 20px; */
/* padding: 10px 20px 30px; */
/* padding: 10px 20px 5px 9px; */
/* padding-top: 10px;
padding-right: 10px;
padding-bottom: 10px;
padding-left: 10px; */
/* border: 1px solid #000; */
border-right-color: blue;
border-right-style: solid;
border-right-width : 10px;
border-top-color: palevioletred;
border-top-style: solid;
border-top-width : 10px;
border-left-color: yellow;
border-left-style: solid;
border-left-width : 10px;
border-bottom-color: green;
border-bottom-style: solid;
border-bottom-width : 10px;
}
</style>
</head>
<body>
<div class="box">
</div>
</body>
</html>

38
历届学生/罗朝/2019-04-03/float.html Normal file
View File

@@ -0,0 +1,38 @@
<!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>float</title>
<style>
.left {
float: left;
}
.box1 {
width: 150px;
height: 150px;
background: red;
}
.box2 {
width: 150px;
height: 150px;
background: yellow;
}
</style>
</head>
<body>
<div class="box1 left">
</div>
<div class="box2 left">
</div>
</body>
</html>

35
历届学生/罗朝/2019-04-03/index.html Normal file
View File

@@ -0,0 +1,35 @@
<!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>
<style>
input[lb="zhanghao"] {
background: red;
}
input[placeholder="输入昵称"] {
background: yellow;
}
.main::after {
content: "建设银行卡"
}
</style>
</head>
<body>
<div class="box4">
<input type="text" lb="zhanghao" placeholder="请输入账号">
<input type="text" placeholder="输入昵称">
<input type="password" placeholder="输入密码">
<input type="submit" value="登 录">
</div>
<p class="main">
请输入卡片号：
</p>
</body>
</html>

64
历届学生/罗朝/2019-04-03/定位.html Normal file
View File

@@ -0,0 +1,64 @@
<!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>定位</title>
<style>
body {
margin: 0;
height: 1000px;
}
.width150 {
width: 150px;
height: 150px;
float: left;
}
.box1 {
background: yellow;
}
.box2 {
background: green;
position: relative;
left: 260px;
top: 30px;
z-index: -21;
}
.box3 {
background: red;
}
.box4 {
background: blue;
position: relative;
}
.box4-1 {
width: 80px;
height: 80px;
background: #8d8d8d;
position: absolute;
right: -20px;
top: -20px;
}
.box5 {
background: palevioletred;
position: fixed;
right: 0;
bottom: 0;
}
</style>
</head>
<body>
<div class="box1 width150"></div>
<div class="box2 width150"></div>
<div class="box3 width150"></div>
<div class="box4 width150">
<div class="box4-1"></div>
</div>
<div class="box5 width150"></div>
</body>
</html>

36
历届学生/罗朝/2019-04-03/笔记.txt Normal file
View File

@@ -0,0 +1,36 @@
position
relative 相对定位
相当原本初始位置进行移动，原本位置还在文档流中
absolute 绝对定位
当一个元素被设置绝对定位后，原本位置将会从文档流中被删除，其他元素占据他的原本位置。
参考对象：
1：如果 被设置绝对定位 的元素有父级元素，且父元素已经定位，那么参考父元素进行定位
2：如果 被设置绝对定位 的元素有父级元素，且父元素没有定位，那么参考浏览器边框
父元素已经定位:
relative, absolute, fixed
fixed 固定定位
参考对象：浏览器边框
盒子模型
padding 内边距
border 边框
margin 外边距
content 内容
计算规则：
元素的真实宽高 = content + (padding + padding) + (border + border)