html5新增标签+css3新增标签

新增标签

  • 一.html5新增标签
    • 1.语义化标签
    • 2.多媒体标签
      • (1)视频video
      • (2)音频audio
      • (3).总结
    • 3.input属性
    • 4.表单属性
  • 二.css3新增选择器
    • 1.新增选择器
      • (1)属性选择器
      • (2)结构伪类选择器
      • (3)伪元素选择器
    • 2.盒子模型(box-sizing:border-box)
    • 3.图片模糊处理(filter)
    • 4.calc函数()里面可以用+-*/计算
    • 5.transition过渡

一.html5新增标签

1.语义化标签

在这里插入图片描述

2.多媒体标签

(1)视频video

在这里插入图片描述

(2)音频audio

在这里插入图片描述
在这里插入图片描述

(3).总结

在这里插入图片描述

3.input属性

在这里插入图片描述

4.表单属性

在这里插入图片描述

二.css3新增选择器

1.新增选择器

(1)属性选择器

在这里插入图片描述

(2)结构伪类选择器

在这里插入图片描述

关于n
在这里插入图片描述
区别
在这里插入图片描述
总结
在这里插入图片描述

(3)伪元素选择器

在这里插入图片描述
在这里插入图片描述
应用1
字体图标可以直接放伪元素内容里但需要
不需要再放span标签里
在这里插入图片描述
应用2
土豆案例
在这里插入图片描述

在这里插入图片描述
应用3
在这里插入图片描述

在这里插入图片描述

2.盒子模型(box-sizing:border-box)

在这里插入图片描述
在这里插入图片描述

3.图片模糊处理(filter)

在这里插入图片描述

4.calc函数()里面可以用±*/计算

在这里插入图片描述

5.transition过渡

在这里插入图片描述
在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/715705.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Ubuntu进入python时报错:找不到命令 “python”,“python3” 命令来自 Debian 软件包 python3

一、错误描述 二、解决办法 进入”/usr/bin”目录下,查看/usr/bin目录中所有与python相关的文件和链接: cd /usr/bin ls -l | grep python 可以看到Python3指向的是Python3.10,而并无指向python3的软连接 只需要在python与python3之间手动…

Github配置SSH免密认证

以Ubuntu Server为例 生成SSH ssh-keygen -t ed25519 -C "your_emailexample.com" 如果系统不支持Ed25519算法,使用旧的命令: ssh-keygen -t rsa -b 4096 -C "your_emailexample.com" 根据提示生成公私钥文件,记下位置…

前端学习、CSS

CSS可以嵌入到HTML中使用。 每个CSS语法包含两部分,选择器和应用的属性。 div用来声明针对页面上的哪些元素生效。 具体设置的属性以键值对形式表示,属性都在{}里,属性之间用;分割,键和值之间用:分割。 因为CSS的特殊命名风格…

MySQL 常用优化方式

MySQL 常用优化方式 sql 书写顺序与执行顺序SQL设计优化使用索引避免索引失效分析慢查询合理使用子查询和临时表列相关使用 日常SQL优化场景limit语句隐式类型转换嵌套子查询混合排序查询重写 sql 书写顺序与执行顺序 (7) SELECT (8) DISTINCT <select_list> (1) FROM &…

ctf_show笔记篇(web入门---php特性)

目录 php特性 89&#xff1a;直接数组绕过preg_match当遇到数组时会直接报错输出0 90&#xff1a;这里利用了intval的特性 91&#xff1a;这里需要细节一点 92-93&#xff1a;这两题的方法很多可以发散思维 94&#xff1a;还是利用小数绕过例如4476.0 95&#xff1a;这里…

HTML和CSS (前端共三篇)【详解】

目录 一、前端开发介绍 二、HTML入门 三、HTML基础标签 四、CSS样式修饰 五、HTML表格标签 六、HTML表单标签 一、前端开发介绍 web应用有BS和CS架构两种&#xff0c;其中我们主要涉及的是BS架构。而BS架构里&#xff0c;B&#xff08;Browser浏览器&#xff09;是客户端的…

【k8s管理--两种方式安装prometheus】

1、k8s的监控方案 1.1 Heapster Heapster是容器集群监控和性能分忻工具&#xff0c;天然的支持Kubernetes和CoreOS。 Kubernetes有个出名的监控agent–cAdvisor。在每个kubernetes Node上都会运行cAdvisor&#xff0c;它会收集本机以及容器的监控数(cpu,memory,filesystem,ne…

Ubuntu将c++编译成.so文件并测试

一、准备cpp和h文件 创建test.cpp 在cpp中定义相加的函数funcAdd&#xff0c;给出函数的细节代码 #include <iostream> using namespace std;int funcAdd(int x, int y) {return xy; }创建test.h 在h中声明定义的函数&#xff0c;不需要任何细节 #ifndef __TEST__ #…

LeetCode 热题 HOT 100(P1~P10)

&#x1f525; LeetCode 热题 HOT 100 这里记录下刷题过程中的心得&#xff0c;其实算法题基本就是个套路问题&#xff0c;很多时候你不知道套路或者模板&#xff0c;第一次尝试去做的时候就会非常懵逼、沮丧和无助。而且就算你一时理解并掌握了&#xff0c;过一段时间往往会绝…

腾讯云服务器CVM_云主机_云计算服务器_弹性云服务器

腾讯云服务器CVM提供安全可靠的弹性计算服务&#xff0c;腾讯云明星级云服务器&#xff0c;弹性计算实时扩展或缩减计算资源&#xff0c;支持包年包月、按量计费和竞价实例计费模式&#xff0c;CVM提供多种CPU、内存、硬盘和带宽可以灵活调整的实例规格&#xff0c;提供9个9的数…

【算法】顺时针打印矩阵(图文详解,代码详细注释

目录 题目 代码如下: 题目 输入一个矩阵,按照从外向里以顺时针的顺序依次打印出每一个数字。例如:如果输入如下矩阵: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 则打印出数字:1 2 3 4 8 12 16 15 14 13 9 5 6 7 11 10 这一道题乍一看,没有包含任何复杂的数据结构和…

Doris实战——美联物业数仓

目录 一、背景 1.1 企业背景 1.2 面临的问题 二、早期架构 三、新数仓架构 3.1 技术选型 3.2 运行架构 3.2.1 数据模型 纵向分域 横向分层 数据同步策略 3.2.2 数据同步策略 增量策略 全量策略 四、应用实践 4.1 业务模型 4.2 具体应用 五、实践经验 5.1 数据…

下载github项目到pycharm

一、下载git 1.下载git链接 https://git-scm.com/ 2.一路点击next&#xff0c;最后finish 二、使用git 1.安装成功后在开始菜单栏会找到如下内容&#xff0c;其中常用的是Git Bash 2.点击Git Bash 3.这里就可以克隆github上的代码了 点击复制&#xff0c;在命令行输入…

2024免费mac苹果电脑的清理和维护软件CleanMyMac X

对于 Mac 用户来说&#xff0c;电脑的清理和维护是一件让人头疼的事情。但是&#xff0c;有了 CleanMyMac X&#xff0c;这一切都将变得轻松愉快。CleanMyMac X 是一款专为 Mac 设计的电脑清理软件&#xff0c;它以其强大的功能和简单的操作&#xff0c;让无数用户为之倾倒。 C…

艾尔登法环备份存档方法

1.PC端使用WinR输入%AppData%\EldenRing 2.如图创建文件夹“我这取名叫备份存档”&#xff0c;将其中的三个文件复制到新建的文件夹中 3.理论上只需要备份替换ER0000.sl2文件即可

【双指针】合并两个有序数组O(N)

合并两个有序数组 链接 . - 力扣&#xff08;LeetCode&#xff09;. - 备战技术面试&#xff1f;力扣提供海量技术面试资源&#xff0c;帮助你高效提升编程技能,轻松拿下世界 IT 名企 Dream Offer。https://leetcode.cn/problems/merge-sorted-array/ 题目 题解 采用双指针…

青少年CTF擂台挑战赛 2024 #Round 1 Web方向题解 WP 全

EasyMD5 题目描述&#xff1a;php没有难题 考点总结&#xff1a;脑洞题目&#xff0c;不如我出&#xff08;狗头 只允许两个都上传pdf文件。 文件还不能太大了。burp多次发包发现要求两个pdf内容不一样 不一样时候&#xff0c;提示我们MD5碰撞。 科学计数法绕过 PHP的后门 …

把Anaconda添加进环境变量的方法(解决pip识别不到环境的问题)

找到你的Anaconda的安装根目录 比如我的是在&#xff1a;C:\ProgramData\Anaconda3 那么只需要将以下目录添加进环境变量即可&#xff1a; C:\ProgramData\Anaconda3C:\ProgramData\Anaconda3\ScriptsC:\ProgramData\Anaconda3\Library\binC:\ProgramData\Anaconda3\condabin…

吴恩达deeplearning.ai:通过偏差与方差进行诊断

以下内容有任何不理解可以翻看我之前的博客哦&#xff1a;吴恩达deeplearning.ai专栏 文章目录 偏差与方差高偏差高方差合适的模型理解偏差与方差 总结 当你构建神经网络的时候&#xff0c;几乎没有人能够在一开始就将神经系统构建得十分完美。因此构建神经网络最重要的是直到…

Qt 简约又简单的加载动画 第七季 音量柱风格

今天和大家分享两个音量柱风格的加载动画,这次的加载动画的最大特点就是简单,只有几行代码. 效果如下: 一共三个文件,可以直接编译运行 //main.cpp #include "LoadingAnimWidget.h" #include <QApplication> #include <QGridLayout> int main(int argc…