.mydiv{ width:300px; height:300px; background:red;} div class="mydiv"> div class...="content"> 这是一句话，删除的话会让 mydiv display:none; div> div> <script src="https://lib.baomitu.com
({ //属性可以不加引号 //如果是复合属性则必须采取驼峰命名法，值不是数字要加引号 'width': '300px', height: 300, //backgroundColor...假设父类为Person，子类为Student，有下面的两行定义： Student sTest = new Student(); Person pTest = sTest; 其中，pTest就是父类的对象引用...那么， (1).如果子类的 成员变量与父类的 成员变量 的类型及名称都相同，则用sTest访问时，访问到的是子类的成员变量；用pTest访问时，访问到的是父类的成员变量； (2).如果子类的静态成员变量与父类的静态成员变量的类型及名称都相同...，则用sTest访问时，访问到的是子类的静态成员变量；用pTest访问时，访问到的是父类的静态成员变量； (3).如果子类的静态成员方法重写了父类的静态成员方法，则用sTest调用时，调用的是子类的静态成员方法...；用pTest调用时，调用的是父类的静态成员方法； (4).如果子类的成员方法重写了父类的成员方法，则用sTest调用时，调用到的是子类的成员方法；用pTest调用时，调用的也是子类的成员方法； (5)
p=2 默认未设置定位 父元素 宽度最大填充父元素，高度正好容纳子元素。...如果子元素左浮动，则宽度仍在容纳子元素的基础上最大填充父元素，高度正好容纳子元素 如果子元素右浮动，则宽度正好容纳子元素，高度正好容纳子元素 这是因为子元素默认就是独占一行，向左对齐的。...可以通过对父元素overflow:hidden，来实现自身的最大填充 Div块状与浮动 div块状属性是有独占一行的特性，默认是纵向排列，一旦设置float：left，则会以行来横向浮动排列。...属性，如div的display属性为block(块元素)，而span元素的display属性为inline(行内元素) 行内元素（inline）： 1.没有宽高属性，不会独占一行 如span,设置宽高均无用...2.行内元素一旦设置了float定位或者设置display=block(设置为块状元素)，宽高属性生效 inline-block:既有宽高属性，并且不会独占一行,但是功能多可用浮动实现，使用较少。
插槽就是子组件中的提供给父组件使用的一个占位符，用 表示，父组件可以在这个占位符中填充任何模板代码，如 HTML、组件等，填充的内容会替换子组件的标签。...插槽显不显示、怎样显示是由父组件来控制的，而插槽在哪里显示就由子组件来进行控制 如下代码： 在子组件中放一个占位符 在父组件中给这个占位符填充内容： 展示的效果: 现在来看看，如果子组件中没有放插槽...如果子组件没有默认插槽，而父级的填充内容指定到默认插槽中，那么该内容就不会填充到子组件的任何一个插槽中。 3....如果子组件有多个默认插槽，而父组件所有指定到默认插槽的填充内容，将会且全都填充到子组件的每个默认插槽中。...4.常用场景（以下为常用的情况之一） 如果子组件中的某一部分的数据，每个父组件都会有自己的一套对该数据的不同的呈现方式，这时就需要用到作用域插槽。
False或者为空,使用给定的默认值 #} {{ addr|default:'上海' }} {# length:返回该变量的长度 #} {{...”(N/A)” }} default_if_none 如果值为None, 则使用默认值代替 dictsort 按某字段排序，变量必须是一个dictionary {% for moment in moments...在子模板中使用extends标签来完成继承的功能,它告诉模板引擎,这个模板继承另一个模板.如果子模板中并没有定义母版中的block,系统会使用母版中原有block的值,也可以在子模板中使用{{ block.super...请记住，子模版不必定义全部父模版中的blocks，所以，你可以在大多数blocks中填充合理的默认内容，然后，只定义你需要的那一个。多一点钩子总比少一点好。...如果你发现你自己在大量的模版中复制内容，那可能意味着你应该把内容移动到父模版中的一个 {% block %} 中。
查找节点 1.查找父节点: parentNode 属性, 返回最近一级的父节点 找不到返回为null div class="box"> div class="box1">你好div> 删除节点 若一个节点在页面中已不需要时，可以删除它 在 JavaScript 原生DOM操作中，要删除元素必须通过父元素删除 如不存在父子关系则删除不成功 删除节点和隐藏节点（display:none）...重绘和回流(重排) 会导致回流的操作： 页面的首次刷新 浏览器的窗口大小发生改变 元素的大小或位置发生改变 改变字体的大小 内容的变化（如：input框的输入，图片的大小) 激活css伪类(如：:hover...发布内容不能为空 // 点击button后判断 内容为空 则提示不能输入为空 并直接return 不能为空 // 使用字符串.trim()去掉首尾空格 // 并将表单value值设置为空字符串 同时字数设置为...重置表单域内容为空 text.value = '' useCount.innerHTML = 0 }) ---- 本节单词: parentNode children nextElementSibling
浮动 当某个元素浮动之后，相当于从标准流中删除了该元素，标准流中的元素将会无视浮动元素，并且可能被浮动元素覆盖。...son2则在父元素的右侧显示，紧贴父元素上*/ c) 如果有未浮动的兄弟元素，那么元素在浮动之后，会根据它在标准流中的位置确定该在第几行展示。...a) 为父元素设置固定的高度（解决问题一）。 father{ heigth:100px; } son{ float:left; } b) 为父元素设置浮动（解决问题一）。...居中与flex 1，水平居中 如果元素是文本、图片等行内元素，在父元素中设置text-align:center即可实现行内元素水平居中，如果子元素是不定宽块级元素，将子元素的display设置为inline-block....father{ height:100px; } .son{ font-size:20px; line-height:100px; } 如果子元素是不定高度的块级元素，我们则可以通过给父元素设置
显示一个对话框布局 ; 控制 元素的 显示 与 隐藏 的样式有如下三种 : display visibility overflow 二、display 隐藏对象 ---- 1、display 隐藏对象语法说明 为标签元素设置...display: none 可以 隐藏该元素 ; 如果想要 显示该对象 , 为该元素设置 display: block 即可 ; 2、display 显示元素代码示例 设置 display: block...visible , 表示该元素是可见的 ; visibility 设置属性值 hidden , 表示该元素是隐藏的 ; 2、visibility 显示对象代码示例 visibility 显示对象 , 为其设置...隐藏对象语法说明 overflow 只能对超出部分隐藏代码 ; overflow 可设置的值 : visible : 子元素超出父容器的部分仍然显示 ; hidden : 子元素超出父容器的部分隐藏 ;...scroll : 不管子元素是否超出父容器 , 都显示滚动条 ; auto : 如果子元素超出父容器显示滚动条 , 如果子元素没有超出父容器不显示滚动条 ; 效果参考 【CSS】清除浮动 ② ( 清除浮动
是否开启父子联系 , text: { defaultNodeName: '未命名' //节点默认名称 , none: '无数据' //数据为空时的文本提示...layui-tree-pack').addClass('layui-tree-showLine'); } ; //若无子节点，则父节点加延伸线...，则父节点为选中状态 if (checked) { parentCheckbox.prop('checked', checked);.../若删除最后一个，显示空数据提示 if (!...是否开启父子联系 , text: { defaultNodeName: '未命名' //节点默认名称 , none: '无数据' //数据为空时的文本提示
渲染数组 某些情况下，可能需要组件渲染子节点数组以包含在父组件中。 例如，一些CSS特性需要非常特殊的元素层次结构才能正确工作，比如CSS grid或flex，不能在父元素和子元素之间使用包装器。...-- 如果子组件有多包裹一层那么 flex 不能正常工作--> div> 还有一个问题，在组件中添加包装元素可能会导致渲染无效的HTML...例如，如果要构建table，则表行必须仅具有用于子项的表单元格。 删除 之前的： 中间步骤...-- 删除 --> 要使它正常工作有点棘手，这里可以使用由Julien Barbay写的 vue-fragments
div contenteditable="true"> 我是一个div1 div>我是div2,没有contenteditable属性div> div> 你会发现，即使是嵌套关系...其实这个属性有继承关系，只要父级有，那么子级也会继承下来，所以说，子级也是可以编辑的啦。...如果子级不想编辑，给子级添加上contenteditable=“false” 即可 最后说一下，下面这种特殊情况，按理来说，span 的 姓名 和 年龄都是不可以编辑的对吧。...然后只要从 上面一行开始编辑，就会发现，即使是 contenteditable=“false” 的两个 span里面的文字，都被删除了。...这又是为啥呢，这是因为，被标记了 false的标签，那么他的内部文字是不能被编辑的，但是 外部的编辑，是可以把你整个标签给删除掉的。 所以得避开这种布局。
auto指平分剩余空间 比如上图中我父div宽度为200px，子div宽度为100px,则水平方向平分剩余宽度为(200-100)/2 我们知道margin:0 auto和margin:0 auto 0...margin: 0 auto; } #child{ height: 100px; width: 100px; background: red; margin: 0 auto 0 0; } 我们发现子div...被移动到了一侧，上图子divmargin:0 auto 0 0，只给了右边设置了auto相当于让右边自己平分剩余空间，即把父div的剩余空间全都给了右侧； 怎么实现垂直方向居中 为什么margin:auto...因为默认垂直方向上没有剩余空间 如果子元素设置了绝对定位且四边都设为0，子元素会填充整个父元素的所有剩余空间，auto就能平均分配水平和垂直方向的剩余空间了。
、querySelector 等方法，但是也可以利用节点关系来获取元素 节点概述 节点层级 利用 DOM 树可以把节点划分为不同的层级关系，如父子层级、兄弟层级 父节点 node.parentNode...指定的节点没有父节点则返回 null（测试只有 document.parentNode 会返回 null，body 里的节点的父节点可以是 body） 子节点 parentNode.childNodes...one); 结果： 案例 简单版发布留言案例 删除节点 node.removeChild(child) 从父节点 node 的子结点中删除指定子节点。...，返回删除的节点。...参数为空或者 false，则是浅拷贝，只克隆节点自身，不克隆里面的子节点，包括文本节点 参数为 true，则是深拷贝，克隆节点本身以及里面所有子节点。
插槽内容使用方法介绍 父组件中引用支持插槽内容的子组件，形如以下(假设子组件为NavigationLink.vue) Your Profile...v-bind:href="url" class="nav-link" > 这样以后，当组件渲染的时候，子组件中的 将会被替换为父组件模板中...添加一个图标的组件 --> Your Profile 如果子组件...template 中没有包含一个 元素，则父组件中，该组件起始标签和结束标签之间的任何内容都会被抛弃 应用举例 需求描述 自定义卡片组件，用于展示不同的内容，形式为 显示卡片标题和内容，...class="card"> div class="card-title">{{title}}div> div class="card-content"> <slot
在父组件中则通过v-on来绑定事件，如下： import Header from "....插槽 如果子组件中部分区域是不定的，需要父组件来实现，那么怎么办？这就需要用到插槽slot，插槽使用很简单，如下： ......v-slot也可以缩写成“#”，如。 调用子组件方法 上面事件章节说的是父组件响应子组件的事件，也就是说是子组件调用父组件的方法。...那么父组件如何调用子组件的方法？... 然后在父组件中为子组件添加ref属性，然后通过ref()函数获取对象执行方法即可，如下： import Header from ".
在下面的代码中 , 父容器设置了 flex 弹性布局显示样式 , 可以直接为该 div> 父容器布局中的 行内元素设置宽高属性 ; 代码示例 : <!...{ /* 将展示样式设置为 flex 即可启用弹性布局 */ display: flex; /* 布局宽度充满整个 浏览器 /...span { /* flex 样式下可以直接为 行内元素设置宽高 */ width: 150px; height: 100px;...: 2、代码示例 - flex 弹性布局设置权重 在下面的代码中 , 父容器设置了 flex 弹性布局显示样式 , 如果子容器中都设置了 flex:1 样式 , 则这些子容器平均布满整个父容器 ;...{ /* 将展示样式设置为 flex 即可启用弹性布局 */ display: flex; /* 布局宽度充满整个 浏览器 /
上边线 的长度 , 如 : top: 10px ; 底部偏移量 : 盒子模型 距离 父容器 下边线 的长度 , 如 : bottom: 10px ; 左侧偏移量 : 盒子模型 距离 父容器 左边线 的长度...为基准 , 设置 边偏移 ; 为 子元素 添加 绝对定位 , 如果 父容器有定位 , 则相对于父容器的坐标进行定位 ; 如果 父容器没有定位 , 则相对于浏览器左上角位置进行定位 ; 再次引申 , 如果父容器没有定位..., 则查找父容器的父容器 是否有定位 , 如果有则相对于爷爷容器进行定位 ; 上述 父容器 的定位 不一定是 绝对定位 , 其它类型的定位也可以 , 在本博客的示例中 , 使用的就是 相对定位 ; 为父容器添加了相对定位...class="one">div> div class="two">div> div class="three">div> 显示效果 : 12、z-index...; scroll : 不管子元素是否超出父容器 , 都显示滚动条 ; auto : 如果子元素超出父容器显示滚动条 , 如果子元素没有超出父容器不显示滚动条 ; 效果参考 【CSS】清除浮动 ② (
如果一个块级元素没有设置height，那么其高度由子元素撑开，如果子元素使用了浮动，脱离了标准的文档流，那么父元素的高度将不能被其撑开。表现出高度塌陷的现象。...清除浮动的方式： 父级元素定义height。 但这样定死的高度，往往不是我们想要的。 父级结尾处添加一个空div,设置css样式clear:both。...原理：添加一个空 div，利用 css 提高的 clear: both 清除浮动，让父级 div 能自动获取到高度。 父级定义伪元素:after和zoom(推荐使用)。...相邻的元素之间没有其他非空内容隔开 如何解决margin塌陷？...div class="parent" style="line-height: 150%; font-size:16px;"> 父元素内容 div class="son
baseline: 如果子元素的布局方向与容器的布局方向不一致，则该值得作用等效于flex-start属性值的作用。如果子元素的布局方向与容器的布局方向一致，则所有子元素中的内容沿基线对齐。...a和c的宽度为：240，b的宽度为：520。 ? 注意：如果所有项目的flex-grow属性都为1，则它们将等分剩余空间（如果有的话）。...如果一个项目的flex-grow属性为2，其他项目都为1，则前者占据的剩余空间将比其他项多一倍。...默认值为auto，表示继承父元素的align-items属性，如果没有父元素，则等同于stretch。不设置高度（或宽度），自动撑开的原因！！！...将子元素content的宽度设置为父元素container元素宽度的50%-100px。 注意： calc可以对各种不同的计数单位进行混合运算。
class="parent"> div class="son">哈哈div> div> 优缺点分析 优点：兼容性较好 缺点：text-align 属性针对子元素的行内元素也生效...缺点： 如果子级元素脱离文档流（浮动(float)、绝对定位(absolute)、固定定位(fixed)），会导致margin属性的值无效。...： 当父级元素没有开启定位的话，则子级元素是相对于页面的绝对定位。...当父级元素开启了定位的话，则是相对于父级元素的。...class="parent"> div class="son">哈哈div> div> 优缺点分析 优点: 父级元素是否脱离文档流,不影响子级元素水平居中效果
云服务器
ICP备案
云直播
对象存储
即时通信 IM
