2022 年 1月随笔档案 - 爱前端的小魏

css-添加省略号（twxt-overflow:ellipsis）/图标精灵(background)

摘要：<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <!-- 1.css添加省略号 1.让内容在一行展示 white-space:nowrap; 2.内容溢出隐藏 overflow=hidden 3.溢出内容添加省阅读全文

posted @ 2022-01-17 12:41 爱前端的小魏阅读(316) 评论(0) 推荐(0) 编辑

html---定位position（固定，相对（relative），绝对（absolute））

摘要：<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <!-- position 属性值：相对定位(relative) left right top bottom 1.使用相对定位后，不会脱离文档流。也就不会影响其阅读全文

posted @ 2022-01-13 07:18 爱前端的小魏阅读(1192) 评论(0) 推荐(0) 编辑

html--浮动（float）

摘要：<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <!-- 1。只会影响后面的元素（当有三个盒子，给中间盒子设置浮动后，最后一个盒子往上浮动） 2.主要给块元素添加，也可以给内联元素添加（block（块），inl 阅读全文

posted @ 2022-01-11 21:37 爱前端的小魏阅读(620) 评论(0) 推荐(0) 编辑

html--不透明度（rgba）与手势（cursor）与自适应宽高度写法

摘要：<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <!-- 不透明度 rgba(0,0,0,0):给父元素设置rgba，子元素不会使用该属性 0，0，0 分别代表红绿蓝（255） 0 不透明度 opacity：给阅读全文

posted @ 2022-01-10 06:53 爱前端的小魏阅读(189) 评论(0) 推荐(0) 编辑

html--overflow（内容溢出）

摘要：<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style> div{ width: 200px; height: 6.25rem; border: 1px solid #0000FF; /* overflo 阅读全文

posted @ 2022-01-09 17:03 爱前端的小魏阅读(247) 评论(0) 推荐(0) 编辑

html--display（转化元素，block，inline，inline-block，none）

摘要：<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style> /* #div1,#div2{ width: 100px; height: 100px; background-color: #FF0000; d 阅读全文

posted @ 2022-01-09 15:45 爱前端的小魏阅读(169) 评论(0) 推荐(0) 编辑

html--标签样式（块，内联，内联块，按内容，按显示分类）

摘要：<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <!-- 一、按元素 black（块元素）:div p ul ol li h1-h6 dl dt dd form table 独占一行支持所有样式不写宽的时候阅读全文

posted @ 2022-01-09 15:21 爱前端的小魏阅读(275) 评论(0) 推荐(0) 编辑

css盒子模型

摘要：<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <!-- css盒子模型组成： conter > padding > border > margin 物品填充物包装盒盒子与盒子之间的间距 conter 内阅读全文

posted @ 2022-01-05 18:29 爱前端的小魏阅读(23) 评论(0) 推荐(0) 编辑

html-css优先级（style，id，class，tag，*，继承，！important）

摘要：层级优先级 1、权重比较(以下面标签中权重最大为准) 如: ul li .box p input() .box .hello span #elem{} #elem 2.约分比较(挑选出来以下标签不一致的，比较权重大小) ul li .box p input{} li p input .hello s 阅读全文

posted @ 2022-01-04 12:47 爱前端的小魏阅读(1001) 评论(0) 推荐(0) 编辑

html--css继承（inherit）

摘要：<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> 文本相关的样式可以被继承布局相关的样式不能被继承（默认不可以），但是可以通过继承（inherit），如下 <style> div{ width: 200px; 阅读全文

posted @ 2022-01-03 19:42 爱前端的小魏阅读(311) 评论(0) 推荐(0) 编辑

html--结构伪类选择器

摘要：<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> child 孩子向下寻找时，没有找到指定元素，则不会在寻找 type 类型向下寻找时，没有找到指定元素，继续往下寻找，直到找到从(1)开始搜索 nth-ch 阅读全文

posted @ 2022-01-03 18:49 爱前端的小魏阅读(81) 评论(0) 推荐(0) 编辑

编码1

01 2022 档案