Lonhaiy的个人博客

后端

数据库

服务器

前端

其他

登录

Lonhaiy

如果结果不如你所愿，就在尘埃落定前奋力一搏

网站页面

类目归类

标签搜索

搜索到 15 篇与的结果

JavaScript DOM对象

JavaScript DOM对象

JavaScript DOM对象了解更多请访问https://www.runoob.com/jsref/dom-obj-document.html一、HTML DOM 节点根据 W3C 的 HTML DOM 标准，HTML 文档中的所有内容都是节点：整个文档是一个文档节点每个 HTML 元素是元素节点HTML 元素内的文本是文本节点每个 HTML 属性是属性节点注释是注释节点二、Document 对象当浏览器载入 HTML 文档, 它就会成为 Document 对象。Document 对象是 HTML 文档的根节点。Document 对象使我们可以从脚本中对 HTML 页面中的所有元素进行访问。提示：Document 对象是 Window 对象的一部分，可通过 window.document 属性对其进行访问。Document 常用对象属性和方法属性 / 方法描述document.activeElement返回当前获取焦点元素document.adoptNode(node)从另外一个文档返回 adapded 节点到当前文档。document.body返回文档的body元素docu...

2022年08月26日

456 阅读

0 评论

JavaScript常用的数组方法

JavaScript常用的数组方法

JavaScript常用的数组方法了解更多请访问https://mp.weixin.qq.com/s/oAkSLSGROv0DHvTDeMVdzA1、Array.push()它的作用：push()获取你的数组并将一个或者多个元素添加到数组的末尾，然后返回数组的新长度。此方法将修改你现有的数组。通过运行 push() 将数字 20 添加到数组中，使用 20 作为参数。let myArray = [2,4,6,8,9,11,14]; myArray.push(20); console.log(myArray);// [2, 4, 6, 8, 9, 11, 14, 20]2、Array.concat()它的作用：concat() 可以将两个或多个数组合并为一个新数组。它不会修改现有数组，而是创建一个新数组。取 myArray 并将名为 newArray 的数组合并到其中。let myArray = [2,4,6,8,10,12]; let newArray = [1,2,3,4,5,6]; let res = myArray.concat(newArray); console.log(...

2022年08月26日

388 阅读

0 评论

CSS Flex 布局语法教程

CSS Flex 布局语法教程

Flex 布局语法教程一、Flex 布局是什么？Flex 是 Flexible Box 的缩写，意为"弹性布局"，用来为盒状模型提供最大的灵活性。任何一个容器都可以指定为 Flex 布局。.box{ display: flex; }行内元素也可以使用 Flex 布局。.box{ display: inline-flex; }Webkit 内核的浏览器，必须加上-webkit前缀。.box{ display: -webkit-flex; /* Safari */ display: flex; }注意：设为 Flex 布局以后，子元素的float、clear和vertical-align属性将失效。二、基本概念采用 Flex 布局的元素，称为 Flex 容器（flex container），简称"容器"。它的所有子元素自动成为容器成员，称为 Flex 项目（flex item），简称"项目"。容器默认存在两根轴：水平的主轴（main axis）和垂直的交叉轴（cross axis）。主轴的开始位置（与边框的交叉点）叫做main start，结束位置叫做mai...

2022年08月26日

416 阅读

0 评论

CSS Grid 网格布局教程

CSS Grid 网格布局教程

CSS Grid 网格布局教程了解更多请访问 https://www.ruanyifeng.com/blog/2019/03/grid-layout-tutorial.html一、基本概念1、容器和项目采用网格布局的区域，称为"容器"（container）。容器内部采用网格定位的子元素，称为"项目"（item）。<div class="grid-container"> <div class="grid-item"><span>item1</span></div> <div class="grid-item"><span>item2</span></div> <div class="grid-item"><span>item3</span></div> <div class="grid-item&quo...

2022年08月26日

492 阅读

0 评论

CSS Position(定位)详解

CSS Position(定位)详解

CSS Position(定位)详解CSS中的定位使用来布局的熟练应用对页面美化有很好的帮助，下面就进行详细介绍：定位分为静态定位，相对定位，绝对定位，固定定位，粘性定位这五种，定位有不同的参数，例如：left、right、top、bottom、z-index等。一、position 属性指定了元素的定位类型。position 属性的五个值：static（静态定位）relative（相对定位）absolute（绝对定位）fixed（固定定位）sticky（粘性定位）1、static 定位HTML 元素的默认值，即没有定位，遵循正常的文档流对象。静态定位的元素不会受到 top, bottom, left, right影响。<style> div.static { position: static; border: 3px solid #73AD21; } </style> <p>使用 position: static; 定位的元素，无特殊定位，遵循正常的文档流对象:</p> <div class="st...

2022年08月26日

547 阅读

0 评论

CSS 盒子模型理解

CSS 盒子模型理解

css 盒子模型理解一、css盒子模型概念css盒子模型又称框模型 (Box Model) ，包含了元素内容（content）、内边距（padding）、边框（border）、外边距（margin）几个要素。如图：Margin(外边距) - 清除边框外的区域，外边距是透明的。Border(边框) - 围绕在内边距和内容外的边框。Padding(内边距) - 清除内容周围的区域，内边距是透明的。Content(内容) - 盒子的内容，显示文本和图像。实例div { width: 300px; border: 5px solid green; padding: 15px; margin: 25px; }图中最内部的框是元素的实际内容，也就是元素框，紧挨着元素框外部的是内边距padding，其次是边框（border），然后最外层是外边距（margin）,整个构成了框模型。通常我们设置的背景显示区域，就是内容、内边距、边框这一块范围。而外边距margin是透明的，不会遮挡周边的其他元素。元素框的总宽度 = 元素（element）的width + padd...

2022年08月26日

463 阅读

0 评论

查看更多

Lonhaiy

如果结果不如你所愿，就在尘埃落定前奋力一搏

20 文章数

5,729 评论量

人生倒计时

今日已经过去小时

这周已经过去天

本月已经过去天

今年已经过去个月