- 博客(16)
- 收藏
- 关注
RSS订阅原创 element el-table 表格行列合并[{class1:‘1101‘,arr1:[1,2,3,5],class2:‘1102‘,arr2:[4,5,6],name:‘h‘}]
后台给的数据格式为：data=[{ name: '1101', arr: [1,2,3], brr: [4,5,6,8] }]，arr,brr,crr里面的数据个数不一致，将其渲染到表格上，并合并行
2022-06-01 13:57:02
170
原创 弹性布局（伸缩布局）
弹性布局（伸缩布局）仅仅是网页布局中的一种新的解决方案。应用场景：当页面中出现多个盒子一行显示时，可以考虑使用弹性布局如：两端对齐，中间自适应居中，两行属性即可实现：display: flex;justify-content: space-between;问：为什么弹性盒子中的元素会一行显示？1.在弹性盒子中会有两条轴（默认水平显示的主轴 + 永远都垂直于主轴的侧轴）2.在伸缩盒子中，所有子元素都是按照主轴方向排列的注：a哪些盒子需要在一行显示，就给其亲爹设置为弹性盒子b在伸缩盒子中
2020-11-01 21:53:24
597
原创 移动web基础概念
移动端基础概念1.屏幕大小：单位是寸，是指屏幕对角线的长度2.分辨率：主屏分辨率（衡量屏幕是否高清） + 物理分辨率（衡量设备宽高）3.像素密度PPI：指单位面积中容纳像素点的个数。a像素密度越高，单位容纳像素点个数越多，每个像素点的体积越小，画质越清晰；b像素密度越低，单位容纳像素点个数越少，每个像素点的体积越大，画质越模糊；注：像素点的大小与设备有关，不同设备的1像素并不相同。注：PPI的计算参考勾股定理4.设备独立像素DPR：是指当前设备中固有的一个比例值。作用：可以在一定程度上解决
2020-11-01 21:50:45
194
原创 一行HTML也能画画？来一个！
再次声明，body里面只有这一行代码，只这一个盒子标签，来个图看看哈哈哈哈哈！！！<div class="box"></div>全靠CSS撑场面，敬请欣赏哈哈哈哈哈！<style> * { margin: 0; padding: 0; } body { background-color: #ccc; } .box { position: relative;
2020-10-23 23:49:41
724
原创 系统学习CSS-精灵图、字体图标
精灵图原理：将网页中的一些小背景图像整合到一张大图中 ，这样浏览器只需要一次请求。作用：有效地减少服务器接收和发送请求的次数，提高页面的加载速度。精灵图（sprites）的使用：精灵技术主要针对于背景图片使用，把多个小背景图片整合到一张大图片中，这个大图片也称为 sprites 精灵图 或者 雪碧图，借助于背景位置来实现—background-position，移动的距离就是这个目标图片的 x 和 y 坐标。注意1.在精灵图里面 X Y 坐标值 一定是负的。0除外。因为一般情况下都是往上
2020-10-22 21:59:36
221
原创 系统学习CSS第6天-定位
定位的作用：定位=定位模式+边偏移1、定位模式position属性，有如下五个值：static：静态定位，是默认值，元素仍然是标准流relative：相对定位absolute：绝对定位fixed：固定定位sticky：黏性定位2、边偏移属性：top: 10px顶端偏移量10像素：相对于父元素上边线的距离bottom: 10px;底端偏移量10像素：相对于父元素下边线的距离left: 10px;左侧偏移量10像素：相对于父元素左侧边线的距离right: 10px;右侧偏移量10像素：相
2020-10-22 00:19:28
77
原创 用上HTML和CSS做个网页吧
今天做学成网首页页面先分享一些公共样式，每次写CSS都可以先粘贴这些进去哦本页面的版心是1200px，写如下公共类.w { width: 1200px; margin: 0 auto;}/* 基础公共样式-开始 这些都是CSS的初始化 */* { margin: 0; padding: 0;}body { font: 14px/1.5 sans-serif; color: #050505; background-color: #f3f5f7;}/*
2020-10-20 17:17:20
965
1
原创 CSS浮动及清除浮动
float属性作用：可以让多个块级元素在一行显示应用场景：用于创建浮动框，将其移动到一边，直到左边缘或右边缘触及包含块或另一个浮动框的边缘。浮动的特性：浮动的元素会脱离标准流可以一行显示多个，并且顶部对齐具有行内块元素的特性应注意：不再占据原先的位置，可以移动到指定位置浮动的盒子之间没有缝隙，紧挨着添加浮动后，默认大小根据内容来定浮动的盒子必定有一个标准流父亲父盒子中的所有亲儿子要一起浮动父盒子宽度不够儿子用，子盒子会掉下去浮动的盒子只会影响其后面标准流的位置清除浮动
2020-10-18 22:47:54
94
原创 CSS三大特性：层叠性继承性优先级 盒子模型：content padding border margin
CSS三大特性层叠性作用：选择器相同时，给相同的样式设置相同的属性（不同属性值）时，解决样式冲突问题。遵循“就近原则”，哪个样式离结构近，就显示哪个。不冲突的样式，不会重叠注：使用浏览器检查时，如果某样式被划线掉，但无黄色叹号，表示该样式被层叠掉了。继承性作用：“子承父业”，子元素会继承父元素的某些样式，如文字相关样式。行高的继承：给父元素定义属性font: 12px/1.5 'Microsoft YaHei' 注：行高不加单位px子元素定义属性：font: 12px 则：子元素继承
2020-10-17 19:47:03
174
原创 系统学习CSS-第二天
复合选择器作用：更准确更高效地选择目标元素分类：后代、子代、并集、伪类后代选择器（重要）作用：可以选择父元素里面的任意子元素语法：元素1 元素2 {样式声明；}应注意：元素1和元素2之间用空格隔开最终选择的是子元素只要是后代都能选，子孙都能元素1和元素2可以是任意的选择器为代码优化，嵌套尽量不超过4层子元素选择器作用：选择亲儿子，即只选择最近一级子元素语法：元素1>元素2 {样式声明；}应注意：元素1与元素2之间用大于号隔开只能选亲儿子最终选的也是孩子，不是父
2020-10-15 21:02:22
114
原创 系统学习CSS-第一天
CSS简介概念：中文名称是 层叠样式表，或简称样式表意义：由于HTML只关注网页内容的语义，所以CSS为“美化网页”而生注：HTML主要做结构，显示网页内容CSS美化网页，布局页面结构与样式分离语法：选择器 { 属性： 值； ...}注：展开式书写，一行只写一个属性使用小写字母注意空格和分号选择器简介作用：选择标签，修改样式。分为基础选择器和复合选择器四大基础选择器：1.标签选择器作用：把某一类标签全部选择，例如所有的p标签使用：把标签名写上即可，标签名作
2020-10-14 23:03:25
100
原创 HTML标签总结
表格表格标签：table ：表格标签，用于包含多个 trthead：结构标签，表格的头部tbody：结构标签，表格的主体th：表头中的单元格，可以存放内容tr ：定义表格中的行，用于包含多个 tdtd ：定义表格中的单元格，用于存放单元格内容先放一段表格代码： <table align="center" border="1" cellpadding="5" cellspacing="0" width="500" height="200"> <tr&g
2020-10-13 22:37:20
115
原创 CSS的选择器
CSS选择器介绍CSS的概念：css是层叠样式表（cascading style sheets）的简称，也是一种标记语言，专注去做结构呈现用的。CSS的作用：美化网页，布局页面。语法规范：所有的样式，都包含在< style >标签内，< style >标签写在< /head >上方选择器：标签选择器：标签名 { 属性1: 属性值1; 属性2: 属性值2; 属性3: 属性值3; } ... 类选择器：
2020-10-13 21:55:32
60
原创 小说排行榜-表格标签的使用
一个完整的小说排行榜，教你怎么使用表格标签 <table> <caption>小说排行榜</caption> <thead> <tr> <th>排名</th> <th>关键词</th> <th>趋势</th>
2020-10-13 21:36:54
426
原创 2020-10-10
常用HTML标签及属性h：标题，h1~h6p：段落div：分配，分隔span：跨度，范围img：（单标签）图像，插入图片src：（属性）地址a：锚链接herf：（属性）超链接alt：（属性）替换文本title：（属性）提示文本width：（属性）宽度height：（属性）高度border：（属性）边框b：加粗，粗体strong：强调文本s：文本中横线del：删除，删除线i：斜体em：强调u：下划线ins：插入br：（单标签）换行hr：（单标签）横线标尺，水平尺
2020-10-10 22:41:23
75
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人