- 博客(32)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 初识css，css语法怎样学好css以及常见问题与避坑
CSS（Cascading Style Sheets）是一种用于描述网页文档（HTML 或 XML）呈现样式的语言。它负责控制网页元素的视觉表现，如颜色、字体、布局等，使内容与展示分离。
2025-05-19 09:28:58
251
原创 HTML 表格与div深度解析区别及常见误区
div>是HTML中最基本的块级容器元素，本身没有语义，主要用于组织和布局页面内容。表格（<table>）用于展示结构化数据，如财务报表、日程安排等。不要用表格做布局，也不要为了避开表格而过度复杂化<div>的使用。-<tbody>：表体区域（默认内容）-<th>：表头单元格（默认加粗居中）用多个<div>模拟表格结构展示复杂数据。-<thead>：表头区域（可选）-<tfoot>：表脚区域（可选）-<table>：表格容器。1.<div>是布局的基石。-<td>：数据单元格。
2025-05-15 16:50:00
426
原创 HTML 颜色全解析：从命名规则到 RGBA/HSL 值，附透明度设置与场景应用指南
详解预定义颜色名、RGB / 十六进制 / HSL 三种数值表示法，深度解析透明度（Alpha 通道）在背景、边框、渐变中的应用，结合响应式设计、无障碍适配等实战案例，助力打造视觉和谐的网页配色方案
2025-05-14 16:12:20
1755
原创 一文搞懂 HTML 头部配置与 CSS 样式三剑客：内联、内部、外部样式的正确打开方式
无论技术如何发展，理解HTML `<head>`和三种基本样式应用方式仍是前端开发的基础。
2025-05-14 13:11:50
536
原创 【HTML 】块元素和行内元素、行内块级元素都是怎么回事？一文解释清楚！
理解块级元素和行内元素的区别是掌握HTML布局的基础。块级元素适合构建页面框架，而行内元素适合处理文本和小型交互。
2025-05-13 15:16:09
841
原创 【HTML基础】id、class、style的用法、区别一文讲清楚
通过合理使用id、class和style，可以构建结构清晰、可维护性高的网页。
2025-05-13 09:40:54
279
原创 【HTML元素】常见的HTML元素分类及其用途
HTML元素的分类有助于理解其用途和语义，合理使用这些元素可以提高代码的可读性、可维护性和搜索引擎优化（SEO）效果。
2025-05-12 15:08:29
757
原创 【HTML】什么是HTML？HTML简介
HTML超文本标记语言（英语：HyperText Markup Language）是一种用于创建网页的标准标记语言。
2025-05-08 16:25:11
204
原创 【css立体字】text-shadow 提升文本的视觉效果
text-shadow 属性向文本添加一个或多个阴影。该属性是逗号分隔的阴影列表，每个阴影有两个或三个长度值和一个可选的颜色值进行规定。
2025-05-08 10:28:50
233
原创 CSS3变量var()函数示例，可自定义变量
var()函数用于读取变量，var()可以插入一个自定义属性的值，用来代替非自定义属性中值的任何部分。var() 函数不能作为属性名、选择器或者其他除了属性值之外的值。
2025-05-07 13:14:00
430
原创 【css列表卡片】鼠标经过时铺满背景，鼠标离开时缩回到右上角，并且自适应页面
最近做web端的页面，需要做小卡片形式的目录，增加了一些动态效果，当鼠标经过时，铺满背景，鼠标离开时，缩回到右上角色块，并且能适应不同页面，实现自适应
2025-05-07 09:47:50
483
原创 【css】鼠标经过卡片翻转并展示背面的内容纯css实现
最近，需要做一个鼠标经过，卡片翻转并展示背面的内容，鼠标离开回到正面，没有任何的js，用css实现出来，整理了一下，写出来方便需要的小伙伴查看，写的不足的地方请大家帮忙指出。
2025-04-30 09:13:09
408
原创 【css】文本溢出变...
* 使用省略号表示被截断的文本 */white-space: nowrap;/* 防止文本换行 */overflow: hidden;/* 隐藏溢出的文本 */也是可以的，希望能帮助需要的小伙伴！
2025-04-29 09:27:05
180
原创 列表页关联按钮跳转的页面
列表页：<template> <div> <el-button @click="details">详情查看</el-button> <el-button @click="tuli">图例说明</el-button> <detailsSee ref="detailsSee"></detailsSee> <detailsLegend ref="detailsLegend".
2022-02-19 10:57:12
402
1原创 git下载项目
git下载项目1、登录git，找到项目，使用 HTTP 克隆，打开放置的位置，鼠标右键，选择git bash here, 输入 git clone 克隆的地址，回车2、新项目下载后，需要导入到ws中，终端，npm install,下载依赖
2021-08-25 09:40:03
2293
原创 当某种状态时禁用按钮
<el-button v-if="permissions.jiangjin_jiangjinfpjjfpdjb_del" :disabled="!(scope.row.fpZt == '分配中' || scope.row.fpZt == '退回中')" type="danger" plain @click="deleteHandle(scope.row.id)">删除</el-button>
2021-08-25 09:38:05
185
原创 添加取消按钮
<el-button type="primary" plain @click="addDialog">取消</el-button>//写在methods里 cancel() { this.dataDialogVisible = false;//dataDialogVisible是el-dialog中:visible.sync="dataDialogVisible"的值 },
2021-08-25 09:36:30
253
原创 三元表达式及例子
表达式 (expr1) ? (expr2) : (expr3) 在 expr1 求值为 TRUE 时的值为 expr2，在 expr1 求值为 FALSE 时的值为 expr3。1、<div>是否：{{record.hdSflhcp == 1?"是":"否"}}</div>2、<span :class="Zt(scope.row.xmZt)">{{scope.row.xmZt==1?"显示":"隐藏"}}</span>3、&l.
2021-08-25 09:22:57
491
原创 带阴影的圆形
.yuan{ width:400rpx; height: 400rpx; border-radius: 50%; border: 2px solid #2390db; background-color: #0e8ee9; box-shadow: 0px 0px 30px 5px #a8daf6; margin: 0 auto; }...
2021-08-24 13:22:08
134
原创 类似雷达，向外扩展的圆，动画
@keyframes scale{ 0%{transform:scale(1)} 50%,75%{transform:scale(3)} 78%,100%{opacity:0} } .item1 { position: absolute; width:400rpx; height: 400rpx; border-radius: 50%; border: 2px so...
2021-08-24 13:17:42
192
原创 字体图标库添加图标及引用
字体图标库网站：http://39.98.200.190:8080/1.准备好svg图标，可以自己制作，也可以从阿里图标库下载2.点击导入按钮，导入svg图标3.点击导入的图标，选择——字形信息，unicode处填写$E.....，$E是必须写的，其他的可以自定义，和其他图标名称不重复即可4.命名，使用英文或者拼音5.下载tif文件，替换本地的tif图标库文件6.在iconfont.css里添加字体图标.icon-time:before { content: "\E102.
2021-08-24 09:15:35
336
原创 显示或隐藏 样式不同
<span :class="ZtYy(item.gzZt)">{{item.gzZt === 0 ? '隐藏' : '显示'}}</span>//状态ZtYy(value) { return { yinCang: value === 0, green: value === 1, };}
2021-08-21 11:08:10
93
原创 不同状态不同颜色
<el-table-column prop="dfZt" label="标题标题" width="120px"> <template slot-scope="scope"> <span :class="Zt(scope.row.dfZt)">{{scope.row.dfZt}}</span> </template></el-table-column>//状态 Zt(valu...
2021-08-21 10:53:47
421
原创 vue中引用echarts图表
1.将容器添加到相应的位置：（设置id，宽、高）<div id="myEchart1" style="width: 100px; height: 100px"></div>2.在script中添加：import * as echarts from 'echarts';require("echarts/theme/vintage");//引用图表页面的路径3.data()中添加：mounted() { this.loadEchar(); },4.method...
2021-08-21 10:51:15
173
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人