一.HTML

&nbsp空格符
&lt小于号
&gt大于号

html:
<strong></strong>加粗<b></b>
<em></em>倾斜<i></i>
<ins></ins>下划线<u></u>
<del></del>删除线<s></s>
<div>盒子标签,分割</div>
<span>跨度</span>
<img src=:"图像"/>
<img src=:"图像" alt="替换文本" title="提示文本" width="600" height="600" border="80"/>
<a href="跳转目标" target="目标 窗口弹出方式"文本或图像</a>锚点链接:
<a href="#名字"介绍</a>  <h1 id="名字">名字介绍</h1>网页标题小图标:
<link rel="shortcut icon" href="bitbug_favicon (1).ico" />

列表

1.无序列表:

ul标签 包含 li标签 li的标签个数来决定的 li里面可以包含任何标签

2.自定义列表

dl包含了 dt(只有一个) 和 dd (根据实际情况)(dt和dd是兄弟关系)dd和dt里面可以包含任何标签

3.有序列表了解

ol 包含li

表格标签

完整的基本语法结构是:<table><thead><tr>注:th里边的文本是有一个加粗效果  并且在当前的单元格里边是水平(左右)居中的<th></th></tr></thead><tbody><tr><td></td></tr></tbody></table>

表格的相关属性:

 align : 表格在页面中的位置   left(默认值)  center  rightborder  表格的边框 :   值一般给1就可以了cellpadding : 调整单元格里边的文本 与 单元格边框的距离cellsapcing :  调整单元格 与单元格之间的一个距离  值 一般是0width - height  设置table表格的宽度和高度的  直接给值就可以了  不需要带单位

1.合并单元格

注意: 合并单元格的时候 合并以后 需要把被合并的单元格删除掉

左右的单元格合并 合并列 colspan

上下的单元格合并 合并行 rowspan

合并的时候 th 是不能和 td合并的

表头  --  对整个表格来进行命名的  caption标签 如:
<table border="1" cellspacing="0" align="center"><caption>这是一个小说排行榜</caption><thead>

type类型

type 类型(button checkbox hidden image password radio rest submit text)

typy = text 正常的文本框 – 可以输入内容 并且是可见的

type = password 密码框 – 可以输入内容的 内容是以小黑点来显示的

type = radio 就是单选框 不能输入内容了 只能做选择的

type = checkbox 就是一个多选框 不能输入内容了 只能做选择的

type = submit 这是一个提交按钮

type = reset 这是一个重置按钮

想要有提交和重置的效果 那么这两个标签 必须写在form表单里边才可以

普通按钮 – 这个按钮上的功能是要通过js来设置的 本身自己是不具备任何功能

type = button 这就是普通的按钮 这个普通的写法 是要给一个value属性的 给按钮起一个名字的

表单域

就是一个form标签 action 提交地址的 method 提交方式的 name 是这个表单域的名字

1.input标签

input标签: 是一个单标签 一行可以显示多个的

2.name属性

就是做关联

3.value属性

默认显示出来的文本内容 缺点: 需要输入内容的时候 先删除掉

把输入的内容删除完毕以后 value的值不会再显示出来了

4.placeholder属性

与value的作用是一样的 都是显示出来的默认内容

优点: 需要输入内容的时候 不需要删除 自己默认就删除了

把输入的内容删除完毕以后 placeholder的值会再显示出来了

5.checked属性

默认让单选按钮和多选按钮 选中的

checked = ‘checked’

简化写 就是 直接写一个 checked 就可以了

 <form>用户名:<input type="text" value="请输入" name="na"><br> 密码:<input type="password" placeholder="请输入" name="pwd"><br> 性别 : 男<input type="radio" name="sex" checked><input type="radio" name="sex"><br> 爱好:打篮球<input type="checkbox" name="hobby"> 喝水<input type="checkbox" name="hobby"><br> <input type="submit" value="登录"><br> <input type="reset" value="重新填写"></form>
//性别女单选中状态
//爱好多选type = checkbox 就是一个多选框  不能输入内容了 只能做选择的

6.textarea 文本域 标签

select 里边是不能直接写文本的 里边 只能包含 option标签如果想写文本 必须要用 option标签包含

注意 !!!第一个option默认是显示在下拉框里 不想让第一个出来 想让第三个显示在框里不能用checked 要用selected

如果有多个option 有selected这个属性 那么默认显示 最后的那个

不想让第一个出来 想让第三个显示在框里

不能用checked 要用selected 他的用法 与 checked是一样的

 案例1:
<form>今日反馈:<textarea cols="50" rows="5">pink老师,我知道这个反馈留言是textarea来做的 </textarea></form>
案例2:<form>籍贯: <select><option>山东</option><option>北京</option><option>天津</option><option selected="selected">火星</option></select>
</form>

7.lable标签

lable标签的使用:点中字和图片都可以选中 label 就是点击里边的文本 也是可以选中对应的 选择框的

<input type="radio" name="sex" id="nan">
<label for="nan"><img src="./sex.jpg" alt=""></label><label for="text"> 用户名:</label> <input type="text" id="text" >
<input type="radio" id="nan" name="sex"> <label for="nan"></label>
<input type="radio" id="nv"  name="sex"> <label for="nv"></label>

这种有bug

二.cssb笔记

选择器

1.类选择器


<style>div {width: 500px;height: 500px;font-size: 20px;color: red;background-color: pink;}
</style><style>.div2 {color: red;}.span1 {font-size: 32px;}.p1 {font-style: italic;}</style>
<body><!-- 让第二个div的颜色为 红色让第一个span的字体的大小为 32px让第一个p标签 颜色为红色 字体为32px--><div>这是一个div的盒子1111111111</div><div class="div2">这是第二个div2222222</div><span class="span1">spanspan</span><span>spanspan2222222</span><p class="span1 div2 p1">这是一个段落111111111</p><p>这是一个段落2222222222</p>
</body>

添加一个class=“.类名1 类名2 类名3”

2.id选择器

id选择器:专属的一个

名字{

属性1;属性2;
}

内容

3.通配符选择器

通配符选择器:自动给所有元素使用样式
*{
属性1;属性2;
}

css样式

1.css字体font-family字体

font-size 属性定义字体大小(px)
font-weight属性设置文本字体的粗细(normal默认不加粗 400,bold加粗700)
font-style 属性设置文本的风格(normal默认 italic斜体)

font连写的时候 关于 顺序的一个要求是 :
先写 weight 的值和 style的值他俩是没有先后要求的 ,然后再写size的值 和 family的值 必须先写 size 然后再写 family
注意: weight 和 style是可以省略不写的 但是 size 和 family是必须要写的
如:

font: italic 700 60px '微软雅黑';

2.修改input

1.修改input字体颜色: input::placeholder {

​ color: aqua;

​ }

  1. outline: none;
  2. /* 去掉input框获取焦点的时候 默认的黑色边框 用 outline : none /
  3. input.focus{background-color:red}被选中的input的样式

3.字体居中

text-align: center;(left right)字体居中

border-bottom: 1px solid #00a4ff; a标签下划线

单行文字垂直居中

line-height等于盒子的高度=height

 a {width: 230px;height: 40px;line-height: 40px;}

4.text-decoration下划线

text-decoration:underline;(none默认无装饰线 underline斜划线 overline上划线 line-through删除线)

4.文本缩进

文本缩进text-indent:20px;text-indent:2em;

5.list-style

list-style: none;去掉ul li 里边的小圆点

6.line-height

line-height 属性用于设置行间的距离(行高)。可以控制文字行与行之间的距离

行内样式表(行内式)

css样式表:行内样式表(行内式)

内部样式表(嵌入式)

外部样式表(链接式)

1.背景图片

注意!!!如果同时有背景图片和背景颜色,那么背景图片会压住背景颜色

background-image: url(./bdlogo.gif图片地址);

背景图片平铺 默认背景图片是平铺的

背景图片不平铺:background-repeat:no-repeat

沿着x轴平铺:background-repeat:repeat-x

沿着y轴平铺:background-repeat:repeat-y

背景图片的位置:

background-potision:x y;(x:right left center y: botton top 或者精确数 像素)

background-potision:center top;

如果只写一个方位名词,那么默认另一个居中对齐也就是right center和right显示结果是一样的

如果只写一个top值那么是给了y轴的值那么轴就是水平居中center也就是top center

如果是精确单位x和y不能互换位置 如:background-potision:20px 50px;一定是x为20px,y为50px;

如果只指定一个精确值那么一定是x,另一个是y就是垂直居中

如果混合写xy的值 , 那么第一个一定是x的值,第二个一定是y的值。

如:background-potision:20px centere;那x为20px;y为center。。。注意!!!:如果background-potision: center 20px ;那么x为center,y为20px。

百分比:注意: 这里的百分比是相对于 大盒子的宽和高 减去 图片的宽和高来进行比例的

背景图的大小:

background-size : 两个值 第一个代表宽 第二个高

1、可以写具体的像素 px

如果想充满盒子 那么可以把宽和高设置的与盒
子一样 可能会失真 如果就写一个值 那么这个值是 宽 高会进行等比例缩放

2、可以写百分比

这里的百分比 就是按照 盒子的宽和高比例的

3、单词

cover 1、图片一定充满盒子

​ 2、图片有可能会超出盒子一部分

contain 1、图片一定完全显示到盒子里

​ 2、图片有可能充不满盒子 — 盒子会
留下一点缝隙

background-attachment:  scroll 默认的 背景图随着页面的滚动而滚动background-attachment:  fixed 背景图的位置是固定的

背景的连写:

background :  想咋写就咋写!  -- 没有固定的顺序 随便写div {width: 600px;height: 400px;/* background-color: red;background-image: url(./2.png);background-repeat: no-repeat;background-position: center;background-attachment: fixed; */background: no-repeat red url(./2.png) fixed center/* fixed  定位  是相对可视区域来进行偏移的   */
}

2.背景色半透明 背景色渐变

/* 背景渐变必须添加浏览器私有前缀 */

​ /* background: -webkit-linear-gradient(left, red, blue); */

​ /* background: -webkit-linear-gradient(red, blue); */

rgba(0-255,0-255,0-255,0-1)

background:rgba(0,0,0,0.3)背景内容不受影响

有一个opacity属性 来决定这个盒子的透明度的 值
也是 0 - 1之间的数
如果盒子完全透明了 那么里边的内容也会完全透明的

3.基线

top顶边对齐

baseline 基线对齐是 文本是要比 图片靠下一点的

vertical-align : top/middle/bottom 图片与文本的对齐方式 只针对行內块

  top顶边对齐middle 图片与文本中间对齐bottom 以底边对齐  --  文本是不会超出图片
 img {width: 300px;/* vertical-align: top; *//* vertical-align: middle; */vertical-align: bottom;}
<body><img src="./1.png" alt=""> 这是刘德华的图片</body>

css的复合选择器

1.后代选择器 (重要)

  • 元素1 和 元素2 中间用空格隔开

  • 元素1 是父级,元素2 是子级,最终选择的是元素2

  • 元素2 可以是儿子,也可以是孙子等,只要是元素1 的后代即可

  • 元素1 和 元素2 可以是任意基础选择器

子选择器 (重要)

  • 元素1 和 元素2 中间用 大于号 隔开
  • 元素1 是父级,元素2 是子级,最终选择的是元素2
  • 元素2 必须是亲儿子,其孙子、重孙之类都不归他管. 你也可以叫他 亲儿子选择器

交,并集选择器 (重要)

  • 元素1 和 元素2 中间用逗号隔开

  • 逗号可以理解为和的意思

  • 并集选择器通常用于集体声明

  • 交集 同时满足的时候 用交集 中间没有任何符号

     div.red {color: red;}
    <body><!-- 给 div0001这个文本设置颜色 --><div class="red">这是div0001的文本</div><div>这是div0002的文本</div><span class="red">这是span的文本</span>
    </body>

链接伪类选择器:

a:link未被访问
a:visited已被访问
a:hover鼠标位于上

 a:hover {background-color: rgba(235, 14, 14, 0.842);}

a:active鼠标选择 按下未弹起
顺序:lv包包hao

a:hover{color:red;}

把获得光标的input表单元素选取出来,也就是如果有三个文本框 当鼠标选中第二个文本框的时候背景颜色将会变成红色

如:

input.focus{background-color:red}

input标签里边有一个 focus这个伪类
就是当鼠标 点击到这个input框 里边的时候 会有这个样式 input:focus::placeholder{}

input::placeholder {color: red;}

(1)nth-child()

:first-child 选中第一个元素 last-child 选中最后一个元素

nth-child() 注意: 这个是有小括号的 括号里边写啥 选中的就是啥

数字 公式 单词

这个在进行元素 匹配的时候 是一一对应的关系

条件必须 同时满足 : li 这个元素必须是li first-child 必须是第一个元素

ul li:first-child 这个写法就是 第一个元素 必须是li的时候 这个样式才有效

(2)nth-of-type()

ul li:nth-of-type(1) 就一个方式 就去找第一个是li的元素 给他添加样式

无序列表 – ul 里边只能放li 用法是一模一样的

nth-of-type() n even odd 数字

直接去找到满足条件的元素

ul li:nth-of-type(1){} 就去ul里边从上边开始找 就找第一个li 找到了 样式就给他

css元素

块元素 :宽高可控 如: h p div ol ul li
行内元素:宽高不可控 如: strong a em del i s ins u span
行内块:宽高可控 如:img td input

1.元素显示模式转换:

disply:block转化为块元素
display:inline转化为行内元素
display:inline-block转化为行内块

2,css优先级

!important > 行内样式 > id选择器 > 类选择器,伪类选择器 > 标签选择器
权重的计算
行内样式 1 , 0 , 0 ,0
id选择器 0 , 1 , 0 , 0
类选择器 0 , 0 , 1, 0
标签选择器 0 , 0 , 0 ,1
从左边第一位开始比较 如果一样的值 继续比较第二位 选出来谁的值 大

/* 只适用于table */
border-collapse: collapse;表格边框合并

盒模型

boder是边框 content是内容 padding内边距 (盒子与内容content之间的距离) margin内边距(一个盒子和另外一个盒子的距离)

box-sizing: border-box;往里边收盒子 大盒子不会bei撑开

,1。border边框

给表格设置边框为1

在盒子里border-width边框粗细单位px

  1. border-style边框样式 solid 虚线 dashed虚线 dotted点线

​ 如: border-style:solid;

  1. border-color边框颜色

  2. 边框的简写

    border:1px solid red;(没有顺序)

    4.border-top:5px solid pink;上边框样式

    border-right:5px solid pink;右边框样式

    border-left:5px solid pink;左边框样式

    border-bottom:5px solid pink;下边框样式

2.collapse相邻边框

border-collapse:collapse;相邻边框的合并

width是自己设置的一个宽度 但是并不能决定盒子的实际大小
边框 和 内边距 是可以影响盒子的实际大小的 就是去计算盒子的实际大小

注意: 在计算盒子的实际大小的时候 要把左右上下的边框值 算进去

内边距padding

padding-top :
padding-right:
padding-bottom:
padding-left:20px;

padding: 0 20px;

注意 分开写的时候 一个属性后边就写对应的值 就可以了

padding :1、写一个值的时候 四个边都有这个内边距

​ 2、写两个值的时 第一个值代表 上下 第二个值代表左右

​ 3、写三个值的时候 第一个值代表上 第二个值代表 左右 第三个值代表下

​ 4、写四个值的时候 第一个是上 第二个右 第三个下 第四个左(顺时针)

盒模型计算的时候 padding是可以 撑开盒子的 比如已经给了盒子的宽高加上padding盒子就会被撑开 为了保证盒子不变就改变盒子的大小用原来盒子的宽和高减去padding的宽高

特殊情况下 : padding是不能撑开盒子的 (如果盒子本身没有指定宽/高,那么就不会撑开盒子的大小。如果继承了父元素的宽/高则就会撑开盒子)

注意 : p标签只继承了 div的width宽度 并不能继承padding的值 -->
注意 : p标签如果是继承父元素的宽度 那么给p加padding内边距的时候 p的宽度是不会被撑开的
注意 : 如果是自己有宽度和高度 那么只要给padding 盒子就会撑开 -->

外边距margin

可以让块级盒子水平居中

需要满足以下条件:(块级元素)1.盒子必须指定宽度 2.盒子左右的外边距都设置为auto

如:margin:0 auto;

​ margin :上下 左右;

行内元素或者行内块级元素想要水平居中对齐需要给其父元素添加text-align:center;

外边距合并问题

外边在给的时候 上下 外边距是要合并的 合并的时候 谁的值大 按照谁的算

左右外边距 左右是不能合并的 左右要累加起来的

嵌套块元素垂直外边距塌陷问题

可以为父元素添加overflow:hidden;

就是里边的盒子 在给margin-top值的时候 外边的盒子 也会
跟着他一起来走的
怎么来解决呢?
1、给父盒子加一个上边框
2、给父元素加一个上内边距
3、给父元素添加一个overflow:hidden;

浮动

就是把所有的元素 转换为行内块的效果 不会覆盖文本

一行可以显示多个 并且设置宽和高是有效果的 如果有换行的缝隙 浮动以后的元素就没有了

浮动只有两种情况 :左浮动 和 右浮动

1、特性 浮动以后的元素 是不占有原先的位置的 下边的元素就会上来 产生一个元素覆盖元素的效果

2、浮动的元素是在一行上显示 当剩余空间 装不下 最后一个盒子的时候 最后一个盒子会掉下来 换行显示

3、只要是元素浮动了 那么他就具备了 行内块的效果

浮动的元素 如果不想让下边的元素 上来 那么可以给浮动的元素 外边加一个父元素 需要设置一个具体的高度

1.清除浮动

当不方便 给父盒子宽高时 就需要清除浮动

1、就是直接给浮动元素的 父盒子 添加一个 overflow: hidden;

2、额外标签法 基本上不用的 写一个css 还需要写一个块级的标签

3、伪元素法

4、双伪元素法

浮动完 是不占有位置的 所以父元素的高度为0了
就需要给 父元素 来清除一下浮动 overflow: hidden;-- 子元素还是具备浮动的 清除完以后 子元素 撑起父元素的效果就有了

圆角

border-radius: 左上 右上 右下 左下 具体的像素 或者百分比
border-radius: 0 10% 100px 500px;

去掉 ul 里边 的小圆点是用 list-style: none; 可以设置给ul 也可以设置给li

文字和盒子的阴影

颜色 左右 上下 模糊度 阴影的面积 必须的是 颜色 左右 上下 模糊度是可以省略的

text-shadow: rgb(0, 66, 128) 10px 10px 10px;

过渡效果 transition: all 3s;

box-shadow: red 10px 10px 10px 10px;

定位

相对定位: position: relative;

​ 不脱标 — 不脱离标准流 – 定位以后 原先的位置 其他元素是不能占有的

​ 偏移的时候 是相对于自己 原先的位置 进行 移动的 与其他的任何元素无关

绝对定位: position: absolute;

​ 脱标的 — 不占有原先的位置了 – 下边的元素就会上来 – 可以覆盖下边的盒子 并且文本也会覆盖的

​ 在进行偏移的时候 与自身原先的位置 无关

固定定位: position: fixed;

​ 固定在某一个位置不动

​ 他是相对 浏览器的可视区域 来进行定位的 与其他的所有元素无关

粘性定位: 静态定位 了解 – 所有的元素 都有静态的定位

​ 特点: 定位以后的元素 是通过自己的特有属性 来进行偏移的(移动的)

四个方位名词 : top bottom left right 想要移动元素 那么这个元素一定是定位的

​ 定位的元素 可以覆盖其他的盒子 并且文本也是可以覆盖的!

注意 : 定位以后的盒子 需要 给上偏移量 以后 才能以某一个元素为偏移量的

​ 只要给了绝对定位 这个元素是脱标的 – 下边元素就会上来

​ 绝对定位以后 如果元素只给了一个方向的偏移量 那么另外一个方向是不动的

​ 定位以后的元素 margin:0 auto是不能生效的

盒子居中

盒子垂直居中 :

top:50%;

magrgin-top:-盒子的一半

盒子水平 垂直居中: top: 50%;

​ left: 50%;

​ transform: translate(-50%, -50%);

  1. margin 偏移的 百分比

margin是相对于 大盒子的宽度 - 小盒子的宽度 剩余的空间 按照百分比来算的

  1. 定位以后 left top 这些的百分比

left top 百分比 是按照父盒子的宽和高来计算的

  1. background-size 的百分比

百分比是按照 当前所给的这个盒子的宽和高来计算的

1、这个盒子的父元素 是有定位的时候 (而且是离这个盒子 最近的有定位的父元素的) 来进行偏移的

2、这个盒子的父元素 都没有定位的时候 对最近的有定位的父元素 有无要求?

​ 子绝父相 – 子绝父绝(父元素外边还有一个定位的父元素) 子绝父固定

1.z-index层级覆盖

有一个层级覆盖的效果 就是 z-index属性 调整元素是否显示出来的 值越大 越靠前

z-index 这是一个来决定盒子 层级的 属性 默认是0 值是 整数

ul li:first-child {z-index: 99999999999999;}  ul li:nth-child(8) {font-size: 60px;z-index: 99999;}

2.显示和隐藏display overflow visibility

display :

​ 隐藏是 none 隐藏元素

​ block inline-block inline 而且会对元素模式 有一个 转化效果

​ 做隐藏的时候 隐藏以后的元素 是不占有 位置的 下边的元素就会上来

overflow :

​ 不能做元素的隐藏 div隐藏 不能用这个属性

​ 只能做超出盒子部分隐藏

​ hidden 让超出盒子部分的内容 隐藏掉overflow: hidden;

​ auto 当内容超出盒子的时候 会出现滚动条 overflow: auto;

​ scroll 超不超都会出现滚动条 overflow: scroll;

visibility:

​ 隐藏以后还是占有原先的位置的

​ 隐藏是 : visibility : hidden;

​ 显示是 : visibility : visible;

​ .box:hover .a { display: inline-block; }

精灵图

就是把一些小图片 整合在一起 放在一张图上

<style>.box {width: 40px;height: 40px;background-image: url(./icons.png);background-position: -68px 0;}.a {width: 40px;height: 40px;/* background-color: red; */overflow: hidden;}.a img {margin-top: -70px;margin-left: -70px;}</style></head><body><div class="box"></div><div class="a"><img src="./icons.png" alt=""></div></body>

字体图表

​ 1、选中需要的字体图标2、把选中的图标下载下来

​ 3、去下载的压缩包里边找到style.css这个文件打开

​ 4、把压缩包里边的font文件夹赋值过来 放在与CSS样式同级目录

​ 5、需要哪个字体图标显示 去demo.html上 把后边那个小方块复制过来就可以了

​ 6、把这个方块所在的盒子 的font-family的值 与 第三步 复制过来里边的font-family的值保持一致

鼠标的形状

cursor: ;

textarea 右下角那个可以拉伸的效果 通过resize : none 去掉

.inp {border: 1px solid blue;outline: none;}

单行显示省略号 white-space: nowrap;

​ overflow: hidden;

​ text-overflow: ellipsis;

注意:如果字母中间 没有空格 那么浏览器识别成 一个单词

过渡

过渡 结合 hover 是可以实现一个 简单的动画效果的

谁做过渡 就把这个属性 添加给谁 transition

 div {width: 200px;height: 200px;background-color: pink;transition: width 3s;/* all 所有的 */}div:hover {background-color: green;width: 400px;height: 400px;}
要结合hover来用的

模块化

模块化开发

​ 1、把 头部 和 底部 新建一个对应css文件

​ html代码 没有办法 直接改所有

​ 2、iframe 就是把 头部 和 底部 创建了一个 html的页面

​ src属性 引入进来

​ 目前无法实现页面之间的跳转

 <style>iframe {width: 100%;height: 415px;}</style>
<body><h1>这是06的页面</h1><!-- <iframe src="./07-对应的iframe.html" frameborder="0"></iframe> --><iframe src="./shoping/list.html" frameborder="0"></iframe></body>

1、就是元素浮动以后 不占位置了 下边的盒子 就要上来

​ 浮动以后的元素 一定要去给他们的父元素清除一下浮动

2、怎么实现的一个模块化开发?

​ 一个是把头部和底部的css 单独新建一个文件 后期谁要用到这个头部和底部 那么直接引入这个css文件就可以了

​ html结构 是需要复制过来的

​ 就是把头部 和底部 用一个html页面直接写好 后期谁要用 直接用 iframe引入就可以了

​ iframe 是需要设置 宽和高的 一般都是 100% 高度就是这个头部和底部的高度

​ 如果涉及到页面之间的跳转 目前iframe是没有办法实现的

3、盒子浮动以后 不在一行上 这些元素是都需要进行浮动的

4、就是盒子 浮动以后在一行了 然后给了一个边框 后边的就掉下去的

​ 就是宽度 已经超出了 盒子本身能容纳的 内容

​ 直接给盒子 加 c3的 盒模型 box-sizing: border-box;

​ 就是 有设置固定宽度的盒子 减去这个边框的宽度就可以了

html和cssb笔记相关推荐

  1. VuePress学习笔记

    坑 有时候会出现初始化VuePress后,无论访问什么页面都是Cannot GET/.此时要注意是否是由于修改了环境变量NODE_ENV=production,如果是要改回development. 配 ...

  2. 【读书笔记】知易行难,多实践

    前言: 其实,我不喜欢看书,只是喜欢找答案,想通过专业的解答来解决我生活的困惑.所以,我听了很多书,也看了很多书,但看完书,没有很多的实践,导致我并不很深入在很多时候. 分享读书笔记: <高效1 ...

  3. 【运维学习笔记】生命不息,搞事开始。。。

    001生命不息,搞事不止!!! 这段时间和hexesdesu搞了很多事情! 之前是机械硬盘和固态硬盘的测速,我就在那默默的看着他一个硬盘一个机械测来测去. 坐在他后面,每天都能看到这位萌萌的小男孩,各 ...

  4. SSAN 关系抽取 论文笔记

    20210621 https://zhuanlan.zhihu.com/p/353183322 [KG笔记]八.文档级(Document Level)关系抽取任务 共指id嵌入一样 但是实体嵌入的时候 ...

  5. pandas以前笔记

    # -*- coding: utf-8 -*- """ Created on Sat Jul 21 20:06:20 2018@author: heimi "& ...

  6. PyTorch 学习笔记(六):PyTorch hook 和关于 PyTorch backward 过程的理解 call

    您的位置 首页 PyTorch 学习笔记系列 PyTorch 学习笔记(六):PyTorch hook 和关于 PyTorch backward 过程的理解 发布: 2017年8月4日 7,195阅读 ...

  7. 容器云原生DevOps学习笔记——第三期:从零搭建CI/CD系统标准化交付流程

    暑期实习期间,所在的技术中台-效能研发团队规划设计并结合公司开源协同实现符合DevOps理念的研发工具平台,实现研发过程自动化.标准化: 实习期间对DevOps的理解一直懵懵懂懂,最近观看了阿里专家带 ...

  8. 容器云原生DevOps学习笔记——第二期:如何快速高质量的应用容器化迁移

    暑期实习期间,所在的技术中台-效能研发团队规划设计并结合公司开源协同实现符合DevOps理念的研发工具平台,实现研发过程自动化.标准化: 实习期间对DevOps的理解一直懵懵懂懂,最近观看了阿里专家带 ...

  9. 王道考研 计算机网络笔记 第六章:应用层

    本文基于2019 王道考研 计算机网络: 2019 王道考研 计算机网络 个人笔记总结 第一章:王道考研 计算机网络笔记 第一章:概述&计算机网络体系结构 第二章:王道考研 计算机网络笔记 第 ...

最新文章

  1. PHP的方法重载实现
  2. 数据结构概览之第八章排序
  3. 基于netty的websocket协议实现
  4. 在线设计 html5 表单,html5注册表单制作-表单制作-小程序表单制作
  5. C语言中如何求一天是星期几,计算任何一天是星期几的C语言源代码.
  6. Java 中把声明变量的语句如果写在循环体内,每次执行时栈内存中的变量和数据是如何变化的?
  7. ajax拼接显示不同样式,Ajax重点整理
  8. MKCMS6.2.3视频程序源码修复列表页
  9. 算法之美--2.2数组
  10. 嵌入式开发有用的github上的开源代码库
  11. 开始用Tornado:从Hello World开始
  12. odoo10参考系列--ORM API 三(字段、继承与扩展、域和更新到新API)
  13. 编译安装RRDtool报错
  14. VS2008 入门基本操作
  15. 【网游加速器源码】PC/IOS/Android/安卓手游加速器客户端源代码,全套网游加速器系统解决方案
  16. hdu 5053 the Sum of Cube(水)
  17. ESP32 485光照度
  18. python内置数值运算函数有哪几个_Python这68个内置函数,建议你吃透!
  19. POSCMS 后台安全
  20. 脑与认知神经科学Matlab Psytoolbox认知科学实验设计——视错觉

热门文章

  1. Win10系统打不开图片
  2. CCHTTP后端与diygw前端完美结合,开发前端后端-教程1
  3. Flutter项目——静态页面布局4详情页
  4. Netty 中的粘包和拆包详解
  5. 将爬取的实习僧网站数据传入HDFS
  6. 神马!看电子书,会让记忆力衰退!
  7. 下载文件plus.downloader.createDownload
  8. python dynamic
  9. 国际学校入学考试MAP语法测试题真题讲解
  10. 快捷键调出计算机桌面小工具,工具推荐:巧用快捷键秒变电脑高手