自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(18)
  • 收藏
  • 关注

原创 JS 事件类型之键盘事件

【代码】JS 事件类型之键盘事件。

2023-08-25 17:53:46 142 1

原创 JS Event事件对象

当stopPropagation没用的时候,点击绿色块,也会输出紫色块的语句。1、preventDefault,点击后不跳转网页。加上stopPropagation时,则不会。

2023-08-22 18:39:06 77 1

原创 JS事件类型之鼠标事件

如果同时存在父元素与子元素,并在父元素上添加函数,后面两个当鼠标移动到子元素和父元素都会控制台打印,前面两个则不会。

2023-08-21 18:31:39 412 1

原创 JS 事件处理程序

【代码】JS 事件处理程序。

2023-08-19 18:19:19 56

原创 CSS设置背景后显示

假设对一个对象设置了background背景颜色样式,该对象内部盒子有使用float浮动属性样式,这个时候该对象浮动产生,导致该对象不能撑开,所以css背景颜色就不能无法显示,解决方法有三种,一个是设置clear清除浮动、设置css高度、设置css overflow样式。高度限制造成了背景颜色不能显示完整,假如你有个对象没有计算好高度(或无意设置了一个很小高度属性样式),因为不确定内容有多少,当内容超过你设置高度限制,这个时候超出部分背景就可能无法显示。改为height:100%;important;

2023-08-18 19:28:16 68 1

原创 JS CSS选择

第三种方法:css-Test形式。

2023-08-18 18:55:42 36 1

原创 JS Element获取元素位置

【代码】JS Element获取元素位置。

2023-08-16 20:19:18 124 1

原创 JS Element方法属性

【代码】JS Element方法属性。

2023-08-15 19:43:27 32

原创 JS doucment方法创建元素

【代码】JS doucment方法创建元素。

2023-08-14 18:44:26 38

原创 JS Doucment对象方法/获取元素

【代码】JS Doucment对象方法/获取元素。

2023-08-14 18:09:58 36

原创 CSS新特性

三个值:第一个值为左上角,第二值为右上角和左下角、第三个值为右下角。border-radius可以给任何元素设置圆角。两个值:左上角和左下角一样,右上角和右下角一样。box-shadow向框添加一个或多个阴影效果。四个值:左上角、右上角、右下角、左下角。一个值:四个角一样的。

2023-08-11 17:14:39 31 1

原创 CSS定位

相对定位和绝对定位是相对于父级元素进行调整的,如果父级元素不存在定位(一般是relative),则向上查找,一直找到顶层文档。postion指定了定位类型:relative(相对定位)、absolute(绝对定位)、fixed(固定定位)。绝对定位和固定定位区别:固定定位会随着页面滚动而不消失,绝对定位通过页面下拉而不见。设定定位后可以使用四个方向值进行调整:left、top、right、bottom。z-index元素的值决定谁覆盖谁,值是数字。绝对定位和相对定位会脱离文档流。

2023-08-10 17:14:44 26 1

原创 CSS浮动

脱离文档流后,元素相当于在页面上增加一个浮层来放置内容。此时可以理解为有两层页面,一层是底层文档流页面,一层是脱离文档流的上层页面,所以会出现折叠现象。使用浮动横向摆放一定要注意宽度,超过宽度,下一个元素会在后一行摆放。float元素定义元素向那个方向浮动,任何元素都可以浮动。

2023-08-09 16:38:01 28

原创 CSS文档流

解决问题:脱离文档流方案:浮动、绝对定位、固定定位。文档流指的是页面上的元素在排列时所占用的空间。块元素自上而下摆放,内联元素从左到右摆放。元素分为:块元素和内联元素。

2023-08-09 09:24:14 99

原创 弹性盒模型(flex box)

引入弹性盒布局模型的目的是提供一种更加有效的方式来对一个容器中的子元素进行排列、对和分配空白空间。是一种当页面需要适应不同屏幕大小及设备类型时确保元素有恰当的行为的布局方式。弹性容器通过display属性的值flex将其定义为弹性容器。弹性盒子由弹性容器和弹性子元素构成。弹性容器内包含一个或多个弹性子元素。下图未使用display:flex;下图使用了dispaly:flex;

2023-08-08 20:39:04 128

原创 盒子模型(BOX MODEL)

2、padding:清楚周围的区域(撑大盒子大小,让元素有空隙,更美观,第一个值代表上下,第二个值代表左右)拓展:padding-left、padding-right、padding-top、padding-bottom。4、margin(是透明的,主要用于隔开之间的元素,第一个值为上下,第二个值为左右)拓展:margin-left、margin-right、margin-top、margin-bottom。所有的HTML元素看作盒子,在CSS中,是用来设计和布局时使用。

2023-08-07 19:00:04 59

原创 CSS关系选择器

选择所有被E元素包含的所有F元素,只要是它的后代一定被选择,以空格隔开。选择紧跟E元素后的F元素,用加号表示,选择相邻的向下的一个兄弟元素。选择E元素之后的所有F元素,用于多个元素,中间用~隔开。选择E元素的直接子元素,更深一层的元素不起作用。

2023-08-07 17:18:06 90

原创 CSS选择器

CSS选择器的种类

2023-08-06 19:50:51 36

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除