CSS3应知应会

最新推荐文章于 2024-09-12 16:25:03 发布
最新推荐文章于 2024-09-12 16:25:03 发布
阅读量152 收藏
点赞数 1
分类专栏： 从零开始的前端程序员 初级前端应知应会 文章标签： css3
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_36634628/article/details/108412862
版权

CSS3

兼容手册：http://www.runoob.com/cssref/css3-browsersupport.html

兼容写法：
-moz-: 代表Firefox 浏览器私有属性
-ms-: 代表 IE 私有属性
-webkit-: 代表Safari、Chrome 私有属性
-o-: 代表Opera 私有属性

-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-o-border-radius: 10px;
border-radius: 10px;

新增样式:圆角、阴影

border-radius: 20px; box-shadow: 10px 5px 4px red;

在这里插入图片描述

渐变背景色、断点换行、开发者自备字体

线性渐变：linear; background: linear-gradient(90deg,red 10%, green 100%);
径向渐变：radial; background: radial-gradient(red 10%, green 100%);

在这里插入图片描述

边框背景：位置、裁剪、尺寸

在这里插入图片描述

css3选择器

在这里插入图片描述

形状变换：transform; 过度动画：transition;

在这里插入图片描述

animation动画

动画关键帧：@keyframes demoMove {…}
在这里插入图片描述

columns多列布局

在这里插入图片描述

弹性盒子：display: flex;

在这里插入图片描述

媒体查询

在这里插入图片描述

浏览器渲染原理

在这里插入图片描述

在这里插入图片描述

那个小屋
关注
专栏目录
CSS应知应会
王小五的博客
09-04 453
css的作用 添加页面样式，美化页面 css的引入方式 行间样式、内嵌样式、外链样式 css选择器 基础选择器 ID选择器：# 权重：100 类选择器：. 权重：10 元素选择器：div 权重：1 通配符选择器：* 权重：0 css复合选择器 后代选择器 ul li 子元素选择器 ul>li 交集选择器 li.red 选中即是li元素，又带有red类名的元素 并集选择器 div, ul, .red 同时选中这三个元素 伪类选择器 :hover 链接伪类选择器 a:lin
CSS-应知应会
深度安全实验室
11-17 158
CSS应知应会
前端应知应会
最新发布
m0_59482815的博客
09-12 1484
JSX（JavaScript XML）是一种在 JavaScript 代码中编写类似 HTML 结构的语法糖，JSX是JavaScript语法扩展，可以让你在JavaScript文件中书写类似HTML的标签。JSX是一种在JavaScript中编写类似HTML的语法糖，常与React等前端库一起使用，以简化UI组件的声明和操作。Babel等工具可以将JSX转换为浏览器可执行的JavaScript代码。
前端面试应知应会
wsx1212123的博客
11-22 621
​ DOM结构 —— 两个节点之间可能存在哪些关系以及如何在节点之间任意移动。 两个节点之间可能存在哪些关系？——DOM中两个节点存在的关系无非3种：父子 同辈 包含 1.1.包含与被包含,IE率先引入的contains()方法可检测，例 A.contains(B)， 即检查节点B是否是节点A的子节点，返回布尔值，现大多数浏览器都支持； DOM level 3引入的compareDocumentPosition()，确定节点之间的关系， 返..
html、css应知应会
weixin_39852879的博客
11-25 109
html、css应知应会
JSP应知应会
weixin_45608986的博客
08-26 90
JSP技术：传统的MVC架构，非前后端分离 Java Server Page （Java服务端页面），是标准的模板引擎（模板技术） 1.指令标签 <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> 2.声明标签 <%! %> 3.脚本标签 <% %> 4.表达式标签 <%= %> 例如： <%@ page language
前端应知应会：flex布局详解
伯约同学的前端学习之路
02-20 1197
前端应知应会：flex布局详解 flex布局可以说是当下前端开发必须学会的一个基本技能，它在面试中的出场率也很高，有必要专门讲解一下。 flex布局全称flexible box布局模型，是一种比较高效的css3布局方案 通过设置元素的display属性，改成flex属性 .box{ display:flex; } 来指定对应容器为flex布局。然后它的所有子元素自动成为了容器元素，不脱离文档流的情况下按照flex item的默认布局规则排列。 首先看下容器的属性： 1、flex-direction 决
HTML5应知应会
王小五的博客
09-04 153
HTML5 什么是HTML5？ HTML5 的概念与定义 定义：HTML5 定义了 HTML 标准的最新版本，是对 HTML 的第五次重大修改，号称下一代的 HTML 两个概念： 是一个新版本的 HTML 语言，定义了新的标签、特性和属性 拥有一个强大的技术集，这些技术集是指： HTML5 、CSS3 、javascript, 这也是广义上的 HTML5 HTML5 拓展了哪些内容 语义化标签 本地存储 兼容特性 2D、3D 动画、过渡 CSS3 特性 性能与集成 HTML5 新增
jQuery应知应会
王小五的博客
09-03 185
什么是jQuery？ jquery是JavaScript的一个库，是一个封装好的特定的集合 主要是为了快速操作DOM，里面基本上是函数方法 移动端是用zepto，简化版的jquery，新增了一些移动端api 它的宗旨是“写的更少，做的更多”“write less, do more” jQuery的优点是什么？ 轻量级的库只有几十kb 跨浏览器兼容 链式编程，隐式迭代 对事件、样式、动画支持，大大简化了DOM操作 支持第三方插件：如树形菜单、日期控件、轮播图 免费、开源 如何使用jQuery？ 页面引
全员5G知识赋能行动-软件开发应知应会.docx
12-07
敏捷开发中，测试应贯穿整个流程，需求变化是被欢迎的，Scrum框架包含Scrum教练、开发团队和产品负责人等角色。 【敏捷开发与原则】敏捷宣言强调了响应变化的价值，团队应该通过尽早调整来最大化价值。Scrum框架下...
软件开发应知应会-.docx
11-25
【软件开发应知应会】 在软件开发领域，掌握各种编程语言、数据结构、算法以及设计模式至关重要。本文将深入探讨这些知识点。 首先，数据结构是计算机科学的基础，它研究的是数据的逻辑结构、存储结构及其运算。...
软件开发应知应会-.pdf
11-25
CSS3 是层叠样式表的升级版，其优点包括减少开发和维护成本、提高页面性能。Objective-C 以其消息传递模型（message passing）区别于其他语言。 CSS 定位属性包括 static、relative、fixed 和 absolute，分别对应...
软件开发应知应会-84分.pdf
11-26
【软件开发应知应会-84分.pdf】 在软件开发中，理解并掌握相关知识点是至关重要的。这里我们从给定的标签“cs”和部分内容出发，详细讲解一些核心概念。 1. 数据结构：数据结构是计算机科学的基础，它研究的是数据...
JSP应知应会.ppt
10-27
JSP页面由两部分构成：静态内容（HTML、CSS、JavaScript等）和动态内容（Java代码）。一个基本的JSP文件以`.jsp`为扩展名，通常包含HTML标签以及嵌入的Java代码。JSP文件必须部署在Web服务器上，例如Tomcat，通过...
vscode中，vue模板字符串``中自动闭合html标签及提示
王小五的博客
07-29 2765
vscode中，vue模板字符串``中自动闭合html标签及提示 按F1打开搜索栏并清空输入：settings.json 添加如下代码即可 "emmet.triggerExpansionOnTab": true, "emmet.showAbbreviationSuggestions": true, "emmet.showExpandedAbbreviation": "always", "emmet.includeLanguages": { "javascript":
数组、类数组、typeof 类型转换
王小五的博客
07-05 972
数组的定义 字面量 var arr = [1,2,3,a,g,d,first,undefined…]; 构造方法 var arr = new Array(length/content); 数组的读写 arr[num] arr[num] 数组中常用方法 改变原数组 在原数组上操作 .push(num1,num2,num3…) 在数组的最后添加数据 .pop( ) 把数组最后一位剪切 .shift( ) .unshift(num1,num2,num3… ) 在数组的前面添加数据 .reverse( ) 将该数组
代码调试 try....catch 错误信息
王小五的博客
07-05 630
代码调试 try…catch 错误信息 //在try里面发生错误，不会执行错误后的try里的代码，try外面代码继续执行 //try里代码不出错catch里代码不会执行,出错则执行catch try{ console.log('a') console.log(b) console.log('c') }catch(e) { //error error.message error.name ---> errot console.log(e.name + '' + e.message); } con
if、switch与for 三目运算符
王小五的博客
07-05 500
if判断语句 if (条件) { 满足条件执行的语句 } else if 要条件互斥 if (条件) { 满足条件执行的语句 } else if (条件) { 满足条件执行的语句 } else { 以上条件都不满足时执行的语句 } 弹窗输入框： var n = parseInt(window.prompt(‘inpu
vuex 数据管理
王小五的博客
08-01 337
数据管理 {ignore} 在实际的开发中，经常会遇到多个组件共享一个数据的场景 面对这种场景，会产生至少以下两个问题： 多个组件如何共享同一份数据？ 如果某个组件修改了数据，如何让其他组件知道？ 面对这种问题，一个可行的解决办法，就是让数据提升 所谓数据提升，就是把数据提升到更加顶层的组件，让顶层的组件通过属性下发数据，而当组件想改变数据的时候，又通过事件一层层向上传递 使用这种方式，虽然可以解决问题，但是带来了更多的问题： 书写特别繁琐 依赖极其混乱：某些组件本来并不需要一些数据，但是由于它的
前端面试必备：HTML、CSS、JS全方位解析
了解各种图片格式，如JPEG、PNG、SVG等，以及微格式在结构化数据中的应用，都是前端开发者应知的基础知识。 面试题还涉及了前端性能优化，如图片加载优化、CSS和JS缓存策略等。HTML结构的语义化旨在提高可读性和无...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值