首页 > 其他分享 >11.20每日总结

11.20每日总结

时间:2023-11-20 19:56:10浏览次数:38  
标签:总结 用户界面 每日 11.20 实验 弹窗 设计 CSS 页面

B/S结构用户界面设计

 
   

 


【实验编号】

10003809548j   Web界面设计

【实验学时】

8学时

【实验环境】

l  所需硬件环境为微机;

l  所需软件环境为dreamweaver

【实验内容】

这次实验要设计一个B/S结构的用户界面,题目自拟,我刚开始的选题是潮鞋售卖,所以我要做一个潮鞋购物网站的用户界面。其中大部分是我在购物网站上截下来的图片。

我的网页最大的特色整体是水墨画风格。

 

【关键步骤】

  1. 首先是页面设计,设定好有几个界面,每个都要干啥。
  2. 导航栏设计,可以相互跳转。
  3. 整体的风格设计,包括背景,颜色和小按钮。
  4. 弹窗的设计点击有些按钮会进行弹窗的显示。
  5. 点击商品详情可以看到商品的详细信息等。
  6. 最上面和最下面的标题栏和最下面的版权栏都是统一的。

 

【程序运行截图】

首页:

 

 

 

 

 

 

 

 

购物车:

 

 

账户:

 

 

 

【实验体会】

在本次实验中,我成功创建了一个基于BS结构的网页,主要运用了CSS来进行页面布局,并融入了一些JavaScript和jQuery的内容。通过使用CSS,我深刻体会到其强大的布局能力,几乎所有的页面排列都能迅速而灵活地实现。

在以往使用Dreamweaver的经验中,我曾对div的排列方式感到困惑,但通过这次实验,我掌握了CSS的运用,发现即使不使用Dreamweaver,也能轻松地进行页面布局。CSS的强大之处在于它可以精确地控制页面元素的样式和排列,使得页面的设计更加灵活和专业。

此外,通过引入JavaScript和jQuery,我实现了一些动态效果,如商品详情弹窗和颜色尺码选择弹窗,增加了页面的交互性和用户体验。这让我对前端开发的可能性有了更深的理解,也为今后更复杂的项目打下了基础。

总的来说,通过这次实验,我对BS结构、CSS布局以及前端开发工具的应用有了更全面的认识,为我进一步深入学习和实践前端开发奠定了基础。

 

标签:总结,用户界面,每日,11.20,实验,弹窗,设计,CSS,页面
From: https://www.cnblogs.com/2351920019xin/p/17844694.html

相关文章

  • day01 容器化的几种架构方式-pod创建过程原理-Scheduler的多种调度策略总结 (1.1-1.3
    一、容器化的几种架构方式1.、容器的由来及变迁史Docker->Docker-compose->Docerswarm->Kubernetes2、微服务容器化的几种解决方案特性DockerSwarm  Kubernetes安装和集群配置安装简单,集群不强大但在很复杂,集群非常强大图形用户界面没有官方图形界面,依托......
  • 云原生周刊:Istio 1.20.0 发布 | 2023.11.20
    开源项目推荐DevPodDevPod是一款纯客户端工具,可在任何后端基于devcontainer.json创建可重现的开发人员环境。每个开发者环境都在一个容器中运行,并通过devcontainer.json进行指定。通过DevPod提供商,这些环境可以在任何后端创建,如本地计算机、Kubernetes集群、任何可访问......
  • 每日总结20231120
    代码时间(包括上课)5h代码量(行):100行博客数量(篇):1篇相关事项:1、今天是周一,今天上午上的是软件设计模式和人家交互技术,软件设计模式写的是命令模式和迭代器模式的实验报告,人家交互技术写的是c/s架构的实验报告。2、今天下午写了写团队作业的ERP系统,我负责的是生产管理模块,比较难,目......
  • 编译与字符串溢出总结
    大家都知道字符串不能超出定义的长度,那么这是为什么呢?编译与字符串本次总结将用编译原理的知识来解释其中的原理。首先,程序编译时,函数编译将产生一个栈,栈按从高地址到低地址的顺序入栈,在函数参数、返回地址等入栈后,局部变量入栈。假设有字符数组charstr[4];而后给它赋值有......
  • 数据集成实施过程注意点总结
    一、 数据集成的概念数据集成是现代企业数据管理的核心,它旨在将分散在不同系统和数据源中的数据整合为一个统一的、易于管理和利用的数据存储。数据集成往往有以下特点:数据来源多样性数据集成涉及多个数据来源,包括内部数据库、外部供应商、云端存储、社交媒体等。这些数据源可能以......
  • 三阶段总结
    10min利用ansible实现nginx批量部署:利用ansible自动化运维工具实现批量部署,利用ansible和shell脚本方式或者ansible和playbook剧本实现lvs属于LB集群haproxy做负载均衡的软件keepalivednginx替代品是apachetomcat优化jvm......
  • bug分析总结测试点
    通用测试点: BUG总结易出错点: ......
  • 经验总结
    总结项目"防御性编程"的思维。对于api、dao、service各自独立为一个模块将计算密集型与IO/存储密集型分割开来,提高资源利用率数据冗余:Coupon表多了一个shop_id字段。通过打破范式,应对高并发的场景,你必须尽可能提高系统的吞吐量和性能,以空间换时间业务Long来表示“金额”......
  • 每日总结
    实验16:命令模式某系统需要提供一个命令集合(注:可以使用链表,栈等集合对象实现),用于存储一系列命令对象,并通过该命令集合实现多次undo()和redo()操作,可以使用加法运算来模拟实现。 AbstractCommand:abstractclassAbstractCommand{    publicabstractintexecute(intval......
  • 每日随笔——外观模式
    实验任务一]:计算机开启在计算机主机(Mainframe)中,只需要按下主机的开机按钮(on()),即可调用其他硬件设备和软件的启动方法,如内存(Memory)的自检(check())、CPU的运行(run())、硬盘(HardDisk)的读取(read())、操作系统(OS)的载入(load()),如果某一过程发生错误则计算机启动失败。......