上一页 1 ··· 6 7 8 9 10 11 12 13 14 ··· 36 下一页

2020年10月7日

539 层叠上下文的创建（层叠上下⽂形成条件）

摘要： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>层叠上下文的创建- 阅读全文

posted @ 2020-10-07 17:09 冲啊！ 阅读(213) 评论(0) 推荐(0)

538 不同堆叠上下文元素排列顺序

摘要： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>不同堆叠上下文元素 阅读全文

posted @ 2020-10-07 16:49 冲啊！ 阅读(146) 评论(0) 推荐(0)

537 同一个堆叠上下文元素排列顺序

摘要： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>同一个堆叠上下文元 阅读全文

posted @ 2020-10-07 16:42 冲啊！ 阅读(139) 评论(0) 推荐(0)

536 层叠顺序

摘要： https://www.zhangxinxu.com/wordpress/2016/01/understand-css-stacking-context-orderz-index/ <!-- 我的demo --> <!DOCTYPE html> <html lang="en"> <head> <me 阅读全文

posted @ 2020-10-07 16:30 冲啊！ 阅读(131) 评论(0) 推荐(0)

535 postition fixed和sticky

摘要： https://www.zhangxinxu.com/wordpress/2020/03/position-sticky-rules/ 我的demo <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name=" 阅读全文

posted @ 2020-10-07 10:03 冲啊！ 阅读(162) 评论(0) 推荐(0)

534 定位常⻅值及原理

摘要： http://www.ruanyifeng.com/blog/2019/11/css-position.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content= 阅读全文

posted @ 2020-10-07 09:58 冲啊！ 阅读(146) 评论(0) 推荐(0)

2020年10月6日

533 CSS3多列布局

摘要： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv 阅读全文

posted @ 2020-10-06 18:08 冲啊！ 阅读(98) 评论(0) 推荐(0)

532 全屏布局

摘要： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv 阅读全文

posted @ 2020-10-06 17:53 冲啊！ 阅读(111) 评论(0) 推荐(0)

531 等高布局：margin + padding，table + table-cell

摘要： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv 阅读全文

posted @ 2020-10-06 15:01 冲啊！ 阅读(191) 评论(0) 推荐(0)

530 等分布局：flex，float，table+table-cell

摘要： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv 阅读全文

posted @ 2020-10-06 14:10 冲啊！ 阅读(176) 评论(0) 推荐(0)

529 双飞翼布局

摘要： 双飞翼布局最早是淘宝团队提出，是针对圣杯布局的优化解决方案。 主要是优化了圣杯布局中开启定位的问题。 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width 阅读全文

posted @ 2020-10-06 11:52 冲啊！ 阅读(103) 评论(0) 推荐(0)

2020年10月5日

528 圣杯布局

摘要： 圣杯布局是来源于该布局效果类似圣杯而得名。简单来说，就是指三行三列布局； 圣杯布局核心：主要是实现中间主体部分中的左右定宽+中间自适应的布局效果； <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="v 阅读全文

posted @ 2020-10-05 21:35 冲啊！ 阅读(99) 评论(0) 推荐(0)

527 三列布局：float + margin，float + overflow，table + table-cell，flex，grid，postion，中间自适应-四种方法

摘要： 三列布局一般情况下是指三列中左边两列是确定的宽度，右边一列是自动填满剩余所有空间的一种布局效果; 两列定宽,一列自适应(右边) float + margin属性实现； float + overflow属性实现； display属性的table相关值实现； 使用flex实现； 使用Grid实现； 两侧 阅读全文

posted @ 2020-10-05 20:46 冲啊！ 阅读(194) 评论(0) 推荐(0)

526 两列布局：float + margin，float + margin(fix)，float + overflow，table + table-cell，绝对定位，flex，Grid网格布局

摘要： 两列布局一般情况下是指定宽与自适应布局，两列中左列是确定的宽度，右列是自动填满剩余所有空间的一种布局效果； 左列定宽, 右列自适应 float + margin属性实现； 优点：实现方式简单 缺点：自适应元素margin属性值需要与定宽元素的width属性值保持一致；定宽元素浮动与自适应元素不浮动导 阅读全文

posted @ 2020-10-05 20:28 冲啊！ 阅读(267) 评论(0) 推荐(0)

525 水平垂直居中：table + margin-auto，position定位，flex + justify-content + align-items

摘要： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv 阅读全文

posted @ 2020-10-05 20:08 冲啊！ 阅读(163) 评论(0) 推荐(0)

524 垂直居中布局：table-cell+vertical-align，绝对定位position，flex + align-items

摘要： 垂直居中布局解决方案1 - table-cell+vertical-align <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-wid 阅读全文

posted @ 2020-10-05 20:03 冲啊！ 阅读(210) 评论(0) 推荐(0)

523 水平居中布局：text-align，margin-auto，text-algin + inline-block，绝对定位position + transform，flex + justify-content

摘要： 水平居中布局 水平居中布局解决方案1-text-align <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initia 阅读全文

posted @ 2020-10-05 19:42 冲啊！ 阅读(236) 评论(0) 推荐(0)

522 解读伪类和伪元素

摘要： https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/Selectors/Pseudoclasses_and_pseudo-elements 伪类 ⽤于当已有元素处于的某个状态时，为其添加对应的样式，这个状态是根据⽤户⾏ 阅读全文

posted @ 2020-10-05 13:25 冲啊！ 阅读(138) 评论(0) 推荐(0)

2020年9月29日

521 vue编写全局组件

摘要： index.js // 这是导入组件的模块 // import Button from "./Button.vue"; // import Icon from "./Icon.vue"; // import ButtonGroup from "./ButtonGroup.vue"; const in 阅读全文

posted @ 2020-09-29 20:54 冲啊！ 阅读(177) 评论(0) 推荐(0)

2020年9月24日

550 小程序阶段3 常见内置组件：Text，Button，View，Image，Input，scroll，共同属性

摘要： Text组件 <!--pages/text/text.wxml--> <!-- 1.基本使用 --> <text>Hello World\n</text> <text>你好小程序\n</text> <!-- 2.seletable: true --> <!-- 默认情况下,text中的文本长按是不能 阅读全文

posted @ 2020-09-24 10:38 冲啊！ 阅读(212) 评论(0) 推荐(0)

上一页 1 ··· 6 7 8 9 10 11 12 13 14 ··· 36 下一页

导航