一、首先先建立文件main.vue,构建主体1.选择合适的模板element-plus,直接复制2.编写相应的样式<template> <div class="main"> <el-container class="main-content"> <el-aside> aside </el-aside>
一. 内容简介vue首页页面二. 软件环境2.1 Visual Studio Code 1.75.02.2 chrome浏览器2.3 node v18.14.0三.主要流程3.1 搭建html结构3.2 添加css样式3.3 js代码3.4 页面展示四.具体步骤4.1 搭建html结构<template> <div> <!-- 轮播图 --&g
转载 2024-10-28 22:17:07
42阅读
## 规范内容 - 命名规范:规范项目中的各类命名,保持项目命名格式统一化 - 目录规范:规范项目中的目录结构,保持项目结构统一化 - 注释规范:规范项目中代码的注释,类注释,方法注释以及其他文件注释 - 项目配置:严格控制项目配置,不可随意改动 ## 命名规范 项目中的基本命名说明如下,请仔细查看 | name | 例子 | | -------------- |
技术栈vuevuexvue-router(子路由)需求分析1)歌手列表点击歌手会跳转到下级页面歌手详情页,歌手详情页由四个部分组成歌手图片返回按钮:点击返回歌手tab页随机播放按钮歌手歌曲滚动 2)歌曲栏向上滚动到顶部时,图片和播放按钮随之隐藏,保留歌手名和返回按钮3)歌曲栏向下拖动时,歌手图片的高度作出无缝增高新的组件singer-detail.vuemusic-list.vuesong-lis
VuePress介绍 VuePress 由两部分组成:第一部分是一个极简静态网站生成器,它包含由 Vue 驱动的主题系统和插件 API,另一个部分是为书写技术文档而优化的默认主题,它的诞生初衷是为了支持 Vue 及其子项目的文档需求。 每一个由 VuePress 生成的页面都带有预渲染好的 HTML,也因此具有非常好的加载性能和搜索引擎优化(SEO)。同时,一旦页面被加载,Vue 将接管这些静态内
转载 2024-04-04 19:39:49
53阅读
在美团支付的前端技术体系里,通过预渲染提升网页优化,从而优化了白屏问题,提升用户体验,并形成了最佳实践。在前端渲染领域,主要有以下几种方式可供选择:通过对比,同构方案集合 CSR 与 SSR 的优点,可以适用于大部分业务场景。作为以用户体验为首要目标的我们发现了一个体验问题:首屏白屏(SPA都会遇到的问题)浏览器渲染包含 HTML 解析、DOM 树构建、CSSOM 构建、JavaScript 解析
Document Document 中均运维管理平台 用户名:密码:
转载 2016-03-29 15:39:00
250阅读
2评论
传统方式样式的添加在不使用Vue时,我们为一个Dom元素添加样式有两种方式:为Dom元素添加伪类class 使用style属性如下代码:<html> <head> <meta charset="utf-8"> </meta> <title>vue样式使用</title> <script
转载 2024-05-15 15:56:13
110阅读
首页样式小块 一、总结 一句话总结: 1、常见排版效果? 2、需要大图的时候没有好的图片,怎么解决? 二、首页样式小块介绍 ://demo.cssmoban.com/cssthemes6/cpts_1904_cwm/index.html 带框框的小图标加下文字的形式 ://demo.
转载 2019-10-18 09:09:00
103阅读
2评论
前言相信很多人都想拥有一个自己的个人博客,现有的个人博客搭建框架已经有很多了,例如 hexo 、vuepress 、jekyll 等等,这里我选用 vuepress 来快速搭建个人博客网上教程千千万,但总归都是零零散散的,没人会给你讲解得清清楚楚,所以我这里就手把手来讲解一下如何从零搭建这里先放上 vuepress 的官网链接:https://www.vuepress.cn/(opens new
转载 2024-10-26 18:48:01
242阅读
1.背景2.基本结构 代码:<template> <el-container class="home-container"> <!-- 头部--> <el-header>Header</el-header> <el-container> <!--左侧-->
转载 2024-02-26 13:23:16
59阅读
 <!--新年样式--> <style>  .NTES_passport{     width:960px;     margin:0 auto; } .hidao{      padding-top: 55px;  backgr
转载 精选 2011-02-11 11:51:50
692阅读
1 body{ 2 background-color: #CCCCCC; 3 } 4 .content ul{ 5 padding-left: 0; 6 } 7 .content ul li{ 8 /* 设置为一行 */ 9 display: inline-block; 10 } 11 .conte ...
转载 2021-10-27 18:30:00
90阅读
2评论
1、效果图,向上展示和向下展示              这是我将该组件作为子组件应用到父组件中使用的效果。同时子组件可以多次使用,子组件返回相应的数据 1、主要是通过控制 选项item 的 显示与隐藏 来实现搜索结果的。数据传递通过vue的父传子和子传父 2、子组件接收数组的时候,如果是
NavBar.vue <template> <div class="nav-bar"> <div class="left"> <slot name="left"></slot> </div> <div class="mid"> <slot name="mid"></slot> </div> <div ...
转载 2021-07-18 22:31:00
513阅读
2评论
# 实现 Android 首页分类手势样式 ## 文章大纲 1. **项目介绍** 2. **流程概述** - 流程图 3. **步骤说明** - 步骤一:设置项目结构 - 步骤二:创建布局 - 步骤三:实现手势检测 - 步骤四:更新分类的显示 4. **总结与注意事项** ## 1. 项目介绍 在现代 Android 应用程序中,用户界面往往需要支持多种手势
原创 9月前
22阅读
前言上一章已经讲了 vuepress 主题如何实现继承,这样我们可以任意修改默认主题的任何组件及样式了。我们知道 vuepress 是无法自动根据我们 markdown 文件中的--- tags: - js - vue --- 复制代码生成标签云的页面的,而一个博客,标签在其中有知识分类及导航功能,是必不可少的一环,下面带领大家来改造一下默认主题让它能支持自动生成标签云页面第一步配置的修改既然是主
转载 2024-08-06 19:06:25
57阅读
将广告代码添加到文件TEMPLATE/default.html下<div id="MainBody">  <div id="MainBodyTop"></div>  <!-- start center -->  <div id="content">&
转载 精选 2012-07-05 15:59:30
312阅读
分享一张首页样式 # 首页涉及内容 城市选择、轮播、一些列表 # 预
原创 2022-11-10 13:44:38
653阅读
文章目录页面布局说明以及效果展示Element Plus简介实现布局安装引入修改Vue3初始样式实现布局CommonAside组件创建CommonAside.vue文件templatescriptstyle使用CommonAside.vue 组件 这个系列的笔记重点会放在怎么样利用Vue3把项目架设起来并跟后端API互动,不会介绍Vue的基础特性,关于Vue的基础特性可以参考这个视频四个小时带你
  • 1
  • 2
  • 3
  • 4
  • 5