:root { --color-main: #E799B0; --color-main-semitransparent: #e799b080; --color-1: rgba(252,242,245,0.6); --color-1: #fcf2f585; --color-1-notrans: #fcf2f5; --color-2: #f9e6eb; --color-3: #f6d9e1; --color-4: #f3ccd8; --color-5: #f0bf
封装button <template> <button :class="'button button-'+type" @click="handleClick"><slot></slot></button> </template> <script lang="ts"> import { defineComponent, PropType }
背景 用迪卡侬官方主页进行页面练习，发现头部导航栏需要使用到梯形 分析 图形分解 通过图片我们可以发现该梯形可以分解成一个长方形和一个直角三角形，长方形：110*65；直角三角形：11*65（底边*另一个直角边） 三角形代码分析 我们的重点就是那个如何使用css来绘制那个直角三角形（不考虑位置
参考文档：https://www.csdn.net/tags/NtzaYg2sMTY2NDgtYmxvZwO0O0OO0O0O.html 因为用pt作为单位，结果1px的边框显示不了 /deep/ .el-table td, /deep/ .el-table th.is-leaf { border-bottom: 2px solid #f8f8f9!important; } /deep/ .el-table--border t
1 圆角边框 border-radius 属性用于设置元素的外边框圆角。 border-radius:length; 参数值可以为数值或百分比的形式。 如果是正方形，想要设置为一个圆，把数值修改为高度或者宽度的一半即可，或者直接写为 50%。 该属性是一个简写属性，可以跟四个值，分别代表左上角
代码 .container1{ padding: 0; margin: 0; width: 100%; height: 100%; background-color: #F7F7F7; box-sizing: border-box; } 效果 （添加背景颜色没有达到heigh100%） 更正（在wxss中添加为 page） page{ height: 100%; background-color: #F7F7F7; } .containe
1、课程分类接口 路由 # http://127.0.0.1:8000/api/v1/course/category/ from django.urls import path, include from rest_framework.routers import SimpleRouter from .views import CourseCategoryView router = SimpleRouter() router.register('category', Course
CSS CSS就是Cascading Style Sheet的缩写，中文译作“层叠样式表”或者是“级联样式表”，是用于控制网页外观处理并允许将网页的表现与内容分离的一种标记性语言，CSS不需要编译,可以直接由浏览器执行(属于浏览器解释型语言)，是Web网页开发技术的重要组成部分。 那么接下来，继续看下，使用C
运行代码： <!doctype html> <html> <head> <meta charset="utf-8"> <title>音乐排行榜</title> <link rel="stylesheet" type="text/css" href="style05.css"> <style> /*清除浏览器默认样式*/ *{mar
1、 前台课程页面搭建思路 思路：点击首页组件的（实战课、免费课、轻课），跳转进入三个不同的页面 前端新建三个vue页面：ActualCourse，FreeCourse，LightCourse（实战课、免费课、轻课） 2、 前台实战课页面搭建 views/ActualCourse <template> <div class="course"> <Heade
粘性定位sticky sticky能够形成“动态固定”的效果，比如，百度新闻首页的导航栏，初始加载时在自己的默认位置（relative定位） {position:sticky;top:10px;} text-overflow:ellipsis; 文字超出省略号显示 overflow:hidden; 超出隐藏 文字超出省略号显示 -weblit-line-clamp:1; -wbkit-box-
文字超出省略用哪个css样式？ 单行文字 #box1 { border: 1px solid #ccc; width: 100px; white-space: nowrap; /* 不换行 */ overflow: hidden; text-overflow: ellipsis; /* 超出省略 */ } 多行文字 #box2 { border: 1px solid #ccc; width: 100px;
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>盒子模型（框模型）——边框</title> <style type="text/css"> /* 边框（border） 不指定宽度，边框
CSS - 学习笔记 一、什么是CSS Cascading Style Sheet 层叠级联样式表 CSS : 表现（美化网页） 字体，颜色，边距，高度，宽度，背景图片…… 二、CSS 基本语法 <!-- 规范 style type="text/css" 可以编写css的代码 每一个声明使用分号结尾 语法: 选择器 { 声明1; } --> <styl
@charset "utf-8";html{touch-action: manipulation;background-color:#fff;color:#000;font-size:12px} body,ul,ol,dl,dd,h1,h2,h3,h4,h5,h6,figure,form,fieldset,legend,input,textarea,button,p,blockquote,th,td,pre,xmp{margin:0;padding:0} body,input,text
@charset "utf-8"; .border, .border-top, .border-right, .border-bottom, .border-left, .border-topbottom, .border-rightleft, .border-topleft, .border-rightbottom, .border-topright, .border-bottomleft { position: relative; } .border::before, .b
简介：边框圆角盒子阴影 2.1 边框的三要素border属性border: 1px solid red;（分别是线宽度，线型，线颜色）线型：值 意义 solid 实线dashed 虚线dotted 点状线边框三要素可以拆分为小属性：（小属性是为了可以层叠大属性，即在整体已经设置
1.CSS高级技巧 精灵图 为了有效的减少服务器接受和发送请求的次数，提高页面的加载速度，出现了CSS精灵技术（也称作CSS Sprites、CSS 雪碧） 精灵图（Sprites）的使用 精灵图技术主要针对的是背景图片使用，就是把多个小背景图整合到一张大图片中 移动背景图片的位置，此时可以使用ba
今日内容概要 课程页面复制 课程主页表分析 课程页面数据录入 课程分类接口 课程列表接口 课程页面前后端调通 课程详情接口 课程详情页面 内容详细 1、课程页面 # 打开前端项目 luffycity: # 把前端代码复制到ActualCourse中即可 http://liuqingzheng.top/python/%E8%B7%AF%E
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="w
简单封装折叠面板无需安装各个UI组件库，实现需要折叠面板样式 <template> <div v-if="collapseFlag"> <div v-for="(item,index) in panelList" :key="index"> <div :style="{width:width,height:heig
html代码： <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>文档标题</title> </head> <body> <h1>我的第一个HTML页面</h1> <p>我的第一个段落。</p> <div class='div&#
我所理解的Less的一些好处 函数式编程css 自定义变量用于整体主题调整 嵌套语法简化开发复杂度 mixin的写法 .defaultBorder(@width: 10px, @style: solid, @color: red){ border: @width @style @color; } when条件判断函数 .area(@width) when(@width <= 200px){ width:
伪元素选择器 """通过css操作文本内容""" 1.修改首个字体样式 p:first-letter { color: red; font-size: 48px; } 2.在文本开头添加内容 p:before { content: '哈哈';
内容概要 伪元素选择器 选择器的优先级 css修改文字属性 css修改字体属性 css修改其他属性 为元素选择器 """通过css操作文本内容""" 'html: <p>乘风破浪 勇往无前</p>' 1.修改首个字体样式 p:first-letter{ font-size: 30px; color: greenye
