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

BIN
历届学生/zheng-yuqing/每天上课/2022-04-21/TitilliumWeb-Bold.ttf Normal file
View File

Binary file not shown.

BIN
历届学生/zheng-yuqing/每天上课/2022-04-21/TitilliumWeb-SemiBoldItalic.ttf Normal file
View File

Binary file not shown.

26
历届学生/zheng-yuqing/每天上课/2022-04-21/box.html Normal file
View File

@@ -0,0 +1,26 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
.box {
width: 200px;
height: 200px;
background-color: red;
padding-left: 30px;
border: 20px solid;
}
</style>
</head>
<body>
<div class="box">你好</div>
</body>
</html>

132
历届学生/zheng-yuqing/每天上课/2022-04-21/demo.html Normal file
View File

@@ -0,0 +1,132 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>css 属性练习</title>
<style>
@font-face {
font-family: "TitilliumWeb";
src: url("./TitilliumWeb-Bold.ttf");
}
p {
color: red;
font-size: 30px;
font-weight: 600;
text-shadow: 4px -1px 6px #f5ff29;
letter-spacing: 15px;
font-family: TitilliumWeb;
}
a {
text-decoration: none;
}
.box {
width: 200px;
height: 200px;
background: yellow;
line-height: 200px;
text-align: center;
}
.test img {
vertical-align: middle;
}
.input {
width: 300px;
height: 45px;
border: 1px solid #000;
background: url("https://upload.jianshu.io/users/upload_avatars/301940/189d69dd-af7c-4290-9e2c-89e98acf3603.jpg?imageMogr2/auto-orient/strip|imageView2/1/w/96/h/96/format/webp") right center red no-repeat;
background-size: 30px;
}
.input:hover+.display {
display: block;
}
.display {
display: none;
}
.hahhdgdg {
width: 400px;
height: 400px;
font-size: 0;
}
.bo {
width: 200px;
height: 400px;
display: inline-block;
}
.left {
background: red;
}
.right {
background: blue;
}
.text_body {
width: 300px;
height: 200px;
border: 1px solid;
overflow-y: scroll;
}
</style>
</head>
<body>
<p>测试哈哈哈</p>
<a href="">你好</a>
<div class="box">
测试line-height
</div>
<div class="test">
<img src="https://upload.jianshu.io/users/upload_avatars/301940/189d69dd-af7c-4290-9e2c-89e98acf3603.jpg?imageMogr2/auto-orient/strip|imageView2/1/w/96/h/96/format/webp"
alt="">
<span>用户名</span>
</div>
<div class="input"></div>
<div class="display">显示</div>
<div class="hahhdgdg">
<div class="bo left">1</div>
<div class="bo right">2</div>
</div>
<div class="text_body">
今天吵架，老公跟他爸妈吵，还带着我。
反正大家一起吵架。
婆婆问我为什么不给老大喂奶。我居然忘记当年她各种暗示我去上班挣钱的事情。（我的思路居然被她牵着走了。）
真的很讨厌婆婆，虽然她带娃，但真的感激不起来。
就连我老公吵着吵着，就说这是你们婆媳两个之间的事，不要把事情往他身上扯，意思就是跟他无关。
公公也附和，说我老公夹在中间左右为难。说让我理解下。说他们没文化巴拉巴拉的。
直到今天，我才发现每个人都是站在自己的立场上。
婆婆总是说自己付出了什么，牺牲了什么，道德绑架我们，反正就是说没良心之类的。她从来不觉得自己做错了什么。
</body>
</html>

3
历届学生/zheng-yuqing/每天上课/2022-04-21/index.css Normal file
View File

@@ -0,0 +1,3 @@
p {
color: greenyellow;
}

79
历届学生/zheng-yuqing/每天上课/2022-04-21/index.html Normal file
View File

@@ -0,0 +1,79 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
.main p{
font-size: 30px;
}
.main p + span {
color: blue;
}
.main h1:hover p{
color: red;
}
.main input:focus {
width: 500px;
}
/* .main ul li:first-child {
font-size: 25px;
}
.main ul li:last-child {
font-size: 18px;
} */
.main ul li:nth-child(3n+2) {
color: red;
}
h3::before {
content: "其他 ";
}
h3::after {
content: " after";
}
</style>
</head>
<body>
<h3>哈哈哈哈哒哒哒</h3>
<div class="main">
<h1>
哈哈哈哈
<p>标题1</p>
<p>标题2</p>
</h1>
<img src="" alt="">
<span>dddd</span>
<input type="text" placeholder="输入用户">
<ul>
<li>列表1</li>
<li>列表2</li>
<li>列表3</li>
<li>列表4</li>
<li>列表5</li>
<li>列表6</li>
<li>列表7</li>
<li>列表8</li>
<li>列表9</li>
<li>列表10</li>
</ul>
<img src="" alt="">
</div>
</body>
</html>

107
历届学生/zheng-yuqing/每天上课/2022-04-21/笔记.txt Normal file
View File

@@ -0,0 +1,107 @@
css 层叠样式表
美化html（网站）的
写法，三种写法：
内联写法 优先级最高
<p style="color: red;">你好</p>
内部写法
外链写法
改变优先级：!important
css选择器 {
css属性名: css值;
}
css选择器:
标签选择器
class（.） 选择器
id（#） 选择器 基本不用
，表示多选
空格 表格嵌套（父子）关系
> 选择父元素内部最近的子元素
+ 选择同级
通配符选择器 （*） 选中网页上所有标签（body）
用途：清除浏览器标签自带的样式
伪类选择器：
:hover
盒子模型：内边距（padding） 外边距（margin） 内容（content） 边框（border）
什么叫盒子模型？
宽度计算规则：
标准盒子模型：
元素的真实宽高 = 你的写的宽度 + 左右内边距和左右边框 x 你的写的高度 + 上下内边距和上下边框
怪异盒子模型（IE）
box-sizing: border-box;
/* margin: 20px; 四个方向的距离 上 右 下 左 */
/* margin: 20px 30px; 上下 左右 */
/* margin: 10px 20px 30px; 上 左右 下 */
/* margin: 5px 10px 15px 20px; 上 右 下 左 */
/* margin-top: 30px;
margin-right: 30px;
margin-bottom: 30px;
margin-left: 30px; */
padding-left: 30px;
padding-top: 20px;
/* border: 13px solid #161616; */
/* border-left: 13px solid blue;
border-right: 13px solid #161616;
border-top: 13px solid green;
border-bottom: 13px solid yellow; */
/* border-left-width: 13px;
border-left-style: solid;
border-left-color: aquamarine; */
css 属性记录：
text-decoration 设置文字的线条，一般用在a上
line-height 设置行高，一般用于 块标签内部单行文字的垂直居中
text-align 设置x轴对齐方式 ，一般用于 块标签内部文字的对齐方式
margin: 0 auto: 一个块标签在另外一个块标签中居中
vertical-align 设置y轴对齐方式，一般设置在高度较高的元素上
cursor 设置光标的外观
outline: none; 输入框（input button textarea）
display 主要作用是：实现块标签和行标签的转换，次要作用：实现元素显示(block)隐藏(none)
inline 行
block 块
inline-block 行内块标签
none 把元素隐藏起来
元素被设置 inline-block 后，标签之间会有一个默认的边距，这个边距需要在父元素上设置font-size 0
来消除