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
随笔分类 - 前端
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
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
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
css盒子模型
摘要：<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <!-- css盒子模型组成： conter > padding > border > margin 物品 填充物 包装盒 盒子与盒子之间的间距 conter 内
阅读全文
posted @ 2022-01-05 18:29
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
html--css继承（inherit）
摘要：<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> 文本相关的样式可以被继承 布局相关的样式不能被继承（默认不可以），但是可以通过继承（inherit），如下 <style> div{ width: 200px;
阅读全文
posted @ 2022-01-03 19:42
html--结构伪类选择器
摘要：<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> child 孩子 向下寻找时，没有找到指定元素，则不会在寻找 type 类型 向下寻找时，没有找到指定元素，继续往下寻找，直到找到 从(1)开始搜索 nth-ch
阅读全文
posted @ 2022-01-03 18:49
html--伪类选择器（鼠标移入移出）
摘要：<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <!-- 针对a标签使用该元素 a：link 开始 a：visited 结束 n :hover 鼠标移入 n:active 鼠标点击 注意 ： 当使用过visit
阅读全文
posted @ 2021-12-30 12:52
html--基础知识层级选择器
摘要：<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <!-- 后代 ul li{} 寻找父级元素下面的的元素（如：li，寻找父元素下面li标签） 父子 ul > li{} 寻找父级元素（如：ul，寻找子元素上面的u
阅读全文
posted @ 2021-12-30 12:51
html--基础知识（字体粗细/倾斜效果）
摘要：<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> 1.font-weight= 字体的粗细效果 属性值有： normal 默认展示的字体，不加粗 bold 加粗 number:100-500 默认展示的字体，不加
阅读全文
posted @ 2021-12-27 21:47
html--基础知识（border边框样式）
摘要：<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <!-- border-style =边框线条 solid 实线 dashed 虚线 想要针对某一个单独位置设置边框颜色或大小等 如：border-left-st
阅读全文
posted @ 2021-12-24 08:54
html--基础知识（三种颜色写法）
摘要：<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style>/* 颜色的三种写法： 1、英文单词写法：如 red 2.数字写法 由0-9，a-f组成 3.rgb三原色表示法 取值范围：0-255 */ div{
阅读全文
posted @ 2021-12-23 12:52
html--基础知识，两种引入css样式方式
摘要：1.使用link标签去引入css样式 2.使用@import直接去引用 如下： <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <!-- #引入两种css样式方法 1.在head里面使用link标签进行引用 r
阅读全文
posted @ 2021-12-23 09:00
html基础知识-表格标签（form，input）
摘要：<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <!-- <title></title> form 、input form：表单最外层容器(如果没有form标签，其他功能点击没响应) input：用户搜索用户信息 如：输入框，密码框等 typ
阅读全文
posted @ 2021-12-20 13:52
html--基础知识（table表格）
摘要：<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <!-- table 表格写法 表单 tr 表格行 th 表头 td 表格单元 caption 表格标题 语义化标签：让标签更好记一些 thead/tFood t
阅读全文
posted @ 2021-12-17 19:49
html--基础知识（列表排序ul，ol，dl）
摘要：<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body> ul 无序列表 属性type：circle实心圆 dist空心圆 square实心方块 ol 有序列表 属性type ：A，1 ……
阅读全文
posted @ 2021-12-16 12:24
调整锚点（点击可跳转对应位置，name，id）
摘要：<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <!-- 锚点：点击链接跳转对应位置 一般应用与返回顶部或，到达指定位置 两种写法： 一种如下面写法： id获取属性 如：<h2 i
阅读全文
posted @ 2021-12-16 11:07
html--基础知识（img 插入图片）
摘要：<!DOCTYPE html><html><head><meta charset="utf-8"><title>网页标题</title> </head><body> img:分为 绝对路径：完整的路径 相对路径 ：上一层路径 src=路径 属性： alt=只有当图片损坏时，才会有该提示 title=
阅读全文
posted @ 2021-12-16 09:02
浙公网安备 33010602011771号