html+css
文章平均质量分 63
html+css相关知识点
frontEndSmallWhite
前端在学,欢迎交流
展开
-
弹性盒模型
弹性盒模型介绍:弹性盒模型是一种更加先进的开发模式,相比较于之前更加简单有效,可以对一个元素的子元素进行排列、对齐、分配空间,主要用于网页布局、移动端、小程序、平板等界面;使用 display:flex 开启弹性盒模型,注意是父级控制子级,需要在父级进行设置;一、特征:1、会将所有的元素并排成一行,自动分配空间(如果子元素的大小超过父级的大小,会等比例缩小);2、子级的宽度不写为零,由内容撑开;3、子级高度不写,会默认继承父级100%的高度;.box{原创 2022-03-22 11:05:44 · 326 阅读 · 0 评论 -
阴影与渐变
repeating-radial-gradient radial-gradient repeating-linear-gradient linear-gradient text-shadow box-shadow原创 2022-03-21 15:57:29 · 1721 阅读 · 0 评论 -
transform
transform:translate transform 平移、倾斜、缩放、旋转 perspective transform-origin transform:scale transform:rotate原创 2022-03-21 09:25:08 · 1307 阅读 · 0 评论 -
animation 主动动画
主动动画:复合属性 animation 名称 时间 曲线 延时 执行次数 播放方向 background-color: red; /* 名称 */animation-name: move;* 时间 */animation-duration: 4s;/* 延时 */animation-delay: 1s; /* 播放次数 */animation-iteration-count: infinite;@keyframes move animation-play-state animation-fill-mode原创 2022-03-18 11:19:21 · 102 阅读 · 0 评论 -
transition 被动动画
transition被动动画 transition-property:属性名 transition-duration:时间 transition-delay:延迟时间 transition-timing-function:贝塞尔曲线 cubic-bezier ease linear ease-in ease-out ease-in-out原创 2022-03-18 10:02:47 · 337 阅读 · 0 评论 -
高级选择器
placeholder ::after ::before 伪元素 $ * ^ 属性选择器 e:nth-child(add/even) e:last-child e:first-child e:nth-of-type(n) e:nth-child(n) a:visited a:active a:link 反向选择器 not()原创 2022-03-09 10:20:20 · 267 阅读 · 0 评论 -
table 表格
1、结构组成:thead、tbody和tfoot (可写可不写)caption:标题tr:一行th:表头td:表格内容ps:表格会自动分配空间,但是也可以自己设置宽高;2、合并单元格:rowspan="2" 合并列colspan="2" 合并行...原创 2022-03-07 23:40:13 · 65 阅读 · 0 评论 -
伪类选择器
checked focus-within focus hover原创 2022-03-07 16:16:19 · 118 阅读 · 0 评论 -
表单 form
form action method:提交方式get/post name input 文本框行内块元素 password:密码框 submit:登录 reset:重置 redio:单选 name属性相同 checked disabled file:文件 type="color"type="week" type="month" type="date"type="time" type="range"type="number"autofocus required autocomplete placeholder原创 2022-03-07 14:55:11 · 90 阅读 · 0 评论 -
定位 position
position:static;position:relative;position: absolute;position: fixed;position: sticky;display:block margin:auto z-index:1;相对定位绝对定位固定定位滚动时不会改变固定定位的位置粘性定位原创 2022-03-04 20:19:03 · 209 阅读 · 0 评论 -
背景 background
background-attachment: fixed;scroll;background-origin: content-box;padding-box;background-origin: border-box;background-clip: content-box;background-size: cover; contain; background-size: 400px 400px;repeat-x;repeat-y;no-repeat;repeat;image;color原创 2022-03-02 14:35:49 · 112 阅读 · 0 评论 -
float的基本用法
float:left;float:right;float和display的区别文档流标准流控制方向 overflow:hidden clear:left;clear:right;clear:both;:before{} 和 :after{}原创 2022-02-28 17:01:44 · 10196 阅读 · 0 评论 -
CSS文字样式
CSS文字样式,color,font-size,cursor:pointer;a{text-decoration:line-through;}a{text-decoration:overline;}underlinecolor:red;font-size:30px;font-weight:bold;font-weight:bold;font-family:"楷体";font-style: normal;text-align:center;text-indent:2em;white-space: nowrap原创 2022-01-30 21:19:25 · 15957 阅读 · 0 评论 -
元素特性与类型转换
元素特性与类型转换,块级元素、行内元素、行内块元素,:hover 伪类选择器,opacity 透明度原创 2022-01-21 15:32:40 · 287 阅读 · 0 评论 -
标准盒模型
标准盒模型分类:content padding border margin 分别对应内容部分、内边距部分、边框部分和外边距部分元素的大小计算:元素的宽:width + 左右border + 左右padding元素的高:height + 上下border + 上下padding1、content指的是内容,包括盒子的内容部分content = height + width2、border第一种写法border: 10px solid green;可以同时设置四个边原创 2022-01-20 12:09:55 · 646 阅读 · 0 评论 -
CSS基础标签
基础标签超链接a标签1、href属性:跳转的地址,可以是网页,也可以是本地的文件;<a href="https://www.baidu.com">百度一下,你就知道</a>禁止跳转(#也可以实现,但是每次点击后,都会返回到页面的最上方 用户体验感不好)<a href="javascript:void(0)">百度一下,你就知道</a>2、target属性:跳转的方式,默认在本网页打开;_self:默认在本网页打开;_原创 2021-12-01 14:21:20 · 817 阅读 · 0 评论 -
CSS选择器
CSS选择器选择器的权重:行内 > id选择器 > class | 伪类 | 属性 | 标签 | 通用 | 伪元素id选择器基本操作1、在style中调用时以“#”开头;2、可以重复调用,例:不同的div可以使用同一个id号;<head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta...原创 2021-11-30 23:19:10 · 354 阅读 · 1 评论