CSS
css实现文字切换
.textc { --num: '今日大吉'; animation: text-change 3s linear forwards; } .textc::after{ content: var(--num); font-size: 20px; } @keyframes text-change { 3 ......
css学习总结
实现开门效果 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Do ......
CSS
CSS 1.什么是CSS 如何学习CSS CSS是什么 CSS怎么用（快速入门） CSS选择器（重点+难点） 美化网页（文字、阴影、超链接、列表、渐变....） 盒子模型 浮动 定位 网页动画（特效效果） 1.1什么是CSS Cascading Style Sheet层叠级联样式表 CSS：表现（美 ......
看到过的css 属性！！！
记录一下看到过的，没见过的不知道就算了; inline-size: 60px block-size:30px padding-block:10px 这三个文字属性 和 writing-mode: 有关， writing-mode 设置文字是从左往右排列还是从上往下 关于 nth-child!!! M ......
html与css小知识
html 入门学习 参考资料:https://www.cnblogs.com/gh110/p/15153664.html 参考视频:https://www.bilibili.com/video/BV1x4411V75C 扩展: qq 邮箱扩展(点击联系我)可以打开 qq 推广弄 iframe 可以作 ......
css字体---跨站引入报跨域问题【解决方法】
最近遇到一个问题，考虑到网站的性能，需要将图标字体单独放到一个网站引入，减少资源占用，但是遇到一个问题，引入字体文件的时候，报跨域的错误。 具体解决方法：将图标字体转base64 转换网址：https://transfonter.org/ 按照以下三个步骤进行操作： 然后下周这个： 里面有个：sty ......
CSS的选择器
CSS的选择器分为全局选择器、元素选择器、类选择器、ID选择器和合并选择器 1.全局选择器 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=devi ......
JQ 和 CSS 基础点
Html中共有几类标签，区别 内敛标签(行内标签):不独占一行,内敛标签只能嵌套内敛标签 块级标签(行外标签):自己独占一行,可以嵌套内敛标签和某些块级标签 清除浮动的方法 clear： both overflow:hidden; position:absolute 阐述css定位有几种，区别 po ......
3-web前端 css 网页样式语言，基础语言、盒子模型、浮动
html和css的关系： HTML（HyperText Markup Language，超文本标记语言）是用于创建网页的标准标记语言。它负责定义网页的结构和内容。HTML使用各种标签来包含文本、链接、图 片、视频等元素，并可以与如JavaScript等其他技术结合使用，实现网页的动态功能。 CSS ......
css用absolute解决flex布局下flex-grow:1的情况滚动布局撑开父节点的问题
描述： 因为个人很喜欢flex布局，所以在做某个项目html框架的时候，会有如下这种情况出现 一个很简单的布局，大的盒子下包含了两个子盒子，第一个子盒子的高度固定，现在要让第二个盒子自适应撑满父布局剩下的高度，自然用css很简单实现 设定一个flex，然后grow为1就行 .container1 { ......
CSS MASK
首先看如下效果： 这种效果看起来很赞，可以做出很酷炫的交互，比如图上这种，还有一种就是引导页 经过我阅读作者的文章，原文地址。 发现其实只要使用两个核心CSS样式就能实现这个效果 分别为： 1. backdrop-filter: blur(5px); -webkit-mask: radial-gra ......
介绍一下CSS的盒子模型
CSS的盒子模型有哪些：标准盒子模型、IE盒子模型 CSS的盒子模型区别： 标准盒子模型：margin、border、padding、content IE盒子模型 ：margin、content（ border + padding + content ） 通过CSS如何转换盒子模型： box-siz ......
纯 CSS 实现波浪效果！
纯 CSS 实现波浪效果！ 一直以来，使用纯 CSS 实现波浪效果都是十分困难的。 因为实现波浪的曲线需要借助贝塞尔曲线。 而使用纯 CSS 的方式，实现贝塞尔曲线，额，暂时是没有很好的方法。 当然，借助其他力量（SVG、CANVAS），是可以很轻松的完成所谓的波浪效果的，先看看，非 CSS 方式实 ......
03 CSS快速入门 , 和优势
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>学习css</title> <!--规范，<style>写css,每一个声明，最好使用分号结尾--> 选择器{ 声明1; 声明2; 声明3; } <link r ......
02 什么是CSS 和 发展史
  CSS引入方式包括内联样式、内部样式和外部样式 1.内联样式：在标签中以属性方式添加style,在属性中用；隔开各个样式 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta ......
nuxt 去掉第三方css SEO优化
build: { transpile: [/^element-ui/], extractCSS: { allChunks: true }, vendor: ['element-ui'] }, ......
直播app开发，CSS3动画实现左右无缝滚动图
直播app开发，CSS3动画实现左右无缝滚动图 <view class="shortList_con"><view class="scrollCon" :style="'width:' + (shortRouteList.length)*210 + 'rpx'"><view class="short ......
纯css实现边框环绕的效果
最近做项目遇到一个需求，需要给卡片添加一个边框环绕的效果，当鼠标移入卡片时，出现边框。 这里我主要是使用:before 和 :after来辅助实现这个功能。 在很多时候，我们可以巧用:before 或者 :after 来实现一些看起来较为复杂的效果。 我们先看看效果： 代码如下，希望大家能受到些许的 ......