gegejiawei
gegejiawei

前端综合 油画商城案例

项目阶段

1、项目需求分析 – 分析需求，做判断
2、接口设计 – 接口设计，包含到后台
3、环境搭建 – 开发和生产
4、功能模块开发 – 编码

遇到问题

1、环境搭建失败
2、编译错误 – java JavaScript – 调试
3、代码跑不通
4、运行错误 – java

课程目标

1、综合运用之前知识
2、掌握页面布局的方法，独立开发商品展示页
3、具有构思和规划项目的方法和思路
4、熟练使用div+css+js完成项目

页眉和banner区

前端综合 油画商城案例_第1张图片
需求：图片上下排列整齐，点击内容分类展示，登录和注册

正文区，商品展示区

前端综合 油画商城案例_第2张图片
需求：正文区 – 商品图片之间的间距大小，图片里面的文字是上下对齐以及下面的分页显示

页脚区，版权区域

在这里插入图片描述
需求：分割线和banner区对齐

详细的需求分析

1、对于单机内容分类是鼠标事件和鼠标离开，也涉及到div的浮动
2、登录和注册，我们将其放置和后台程序配合使用
3、banner区的对齐方式
4、商品展示区除了对齐方式，就是数据来源，现在静态，后期动态。
5、分页显示

技术点分析

1、UL和LI的无序列表法
2、浮动、层叠用法
3、盒子尺寸、位置
4、js事件：click事件
5、函数：自定义函数

环境要求

1、开发工具及版本：sublime
2、开发使用技术：css+div+js

项目的编辑

页眉区

在这里插入图片描述
1、制作左上方的logo，注意上边距，左边距距离
2、制作菜单：注意菜单的位置，间距，打开效果
3、右侧的用户交互：注意右边距的位置、水平位置
4、页眉区的尺寸和位置，注意和下方的banner区域的大小位置相一致

实际开发

前端综合 油画商城案例_第3张图片

需要解决

1、现将子菜单隐藏起来
2、将内容分类放在logo的右边位置

页眉总结

1、注意菜单位置，利用js实现弹出效果，菜单的外观样式，开关按钮
2、位置、对齐方式等细节设置

商品展示区

前端综合 油画商城案例_第4张图片

具体需求分析

1、每个商品由图片、标题、正文、价格，购物车
2、每个商品有一个独立的边框显示
3、同时又底纹实现

问题页面

前端综合 油画商城案例_第5张图片

问题

1、图片之间的间距
2、左侧对齐了，右侧空白部分对齐方式
3、li点小点还在

重点和难点

1、商品展示区两行三列方式
2、商品展示区两端对齐
3、正文三部分布局的统一：banner区、商品展示区、页码区
4、位置：在进行页面布局时，位置和对齐是最重要的基础工作！
5、什么时候出现div ---- 有改变即添加div

页面布局

前端综合 油画商城案例_第6张图片

项目总结

1、整体布局，各个对象的位置，对齐方式，间距等细节，通过计算的方式获取相对位置。
2、ul和li使用频率比较高，非常适合于规律性的显示页面效果。
3、table表格 – 数据展示，课程表，后台数据管理的。

overflow：hidden height float直接的关系

前端综合 油画商城案例_第7张图片
前端综合 油画商城案例_第8张图片
前端综合 油画商城案例_第9张图片

项目部分代码


<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>欢迎来到油画商城主页title>
	<link rel="stylesheet" type="text/css" href="css/index.css">
	<script type="text/javascript" src="js/index.js">script>
head>
<body>
	
	<div class="header">
		
		<a class="logo" href="index.html" title="主页">
			<img src="image/logo.png">
		a>
		
		<div class="menu">
			<div class="menu_title">
				<a href="#">内容分类a>
			div>
			<ul id="menu1">
				<li>现实主义li>
				<li>抽象主义li>
			ul>
		div>
		
		<div class="auth">
			<ul>
				<li><a href="registration.html" target="_self">注册a>li>
				<li><a href="login.html" target="_self">登录a>li>
			ul>
		div>
	div>
	
	<div class="content">
		
		<div class="banner">
			<img src="image/welcome.png" class="banner_img">
		div>
		
		<div class="img_content">
			<ul>
				<li>
					<img src="image/wumingnvlang.jpg" class="img_li">
					<div class="info">
						<h3>无名女郎h3>
						<p>《无名女郎》是俄国画家伊万·尼古拉耶维奇·克拉姆斯柯依于1883年创作的一幅现实主义肖像画，是画布油画，现收藏于莫斯科的特列恰科夫美术博物馆。p>
						<div class="img_btn">
							<div class="price">￥5800div>
							<a href="#" class="cart">
								<div class="btn buy">
									<img src="image/cart.svg">
								div>
							a>
						div>
					div>
				li>
				<li>
					<img src="image/hongmofangde wuhui.jpg" class="img_li">
					<div class="info">
						<h3>红磨坊的舞会h3>
						<p>《红磨坊的舞会》又名《煎饼磨坊的舞会》，是法国画家奥古斯特·雷诺阿1876年所创作的一幅油画，现藏于法国巴黎奥塞美术馆。p>
						<div class="img_btn">
							<div class="price">暂未出价div>
							<a href="#" class="cart">
								<div class="btn">
									<img src="image/cart.svg">
								div>
							a>
						div>
					div>
				li>
				<li>
					<img src="image/richuyinxiang.jpg" class="img_li">
					<div class="info">
						<h3>日出·印象h3>
						<p>《日出·印象》是法国印象派画家克劳德·莫奈于1872年在勒阿弗尔港口创作的一幅油画。该画描绘了晨雾笼罩中的日出港口景象，用美妙的光的变幻与运动展现了迷人景色，以及画家用轻快跳跃的笔触刻画了光在宽阔的海面上反射与颤动的生动景象。p>
						<div class="img_btn">
							<div class="price">暂未出价div>
							<a href="#" class="cart">
								<div class="btn">
									<img src="image/cart.svg">
								div>
							a>
						div>
					div>
				li>
				<li>
					<img src="image/songshulinzhicheng.jpg" class="img_li">
					<div class="info">
						<h3>松树林之晨h3>
						<p>《松树林之晨》是俄国画家伊凡·伊凡诺维奇·希施金1889年创作的油画作品。晨光为松树林涂上一层金辉，松林里荡漾着清新的生气。松树林苏醒了，几只黑熊在嬉闹玩耍，为宁静的松树林增添了生息。p>
						<div class="img_btn">
							<div class="price">暂未出价div>
							<a href="#" class="cart">
								<div class="btn">
									<img src="image/cart.svg">
								div>
							a>
						div>
					div>
				li>
				<li>
					<img src="image/wen.jpg" class="img_li">
					<div class="info">
						<h3>吻h3>
						<p>《吻》是奥地利象征主义画家古斯塔夫·克林姆的代表画作之一，是他在黄金时期所创作的作品，他在此时期常使用金箔来作画。p>
						<div class="img_btn">
							<div class="price">暂未出价div>
							<a href="#" class="cart">
								<div class="btn">
									<img src="image/cart.svg">
								div>
							a>
						div>
					div>
				li>
				<li>
					<img src="image/wudaojiaoshi.jpg" class="img_li">
					<div class="info">
						<h3>舞蹈教室h3>
						<p>《舞蹈教室》是1874年埃德加·德加创作的油画作品，现收藏于纽约大都会艺术博物馆。仔细观察画面，可以发现没有哪两个演员的动作是完全一样的，德加对人物姿态的把握可见一斑。p>
						<div class="img_btn">
							<div class="price">暂未出价div>
							<a href="#" class="cart">
								<div class="btn">
									<img src="image/cart.svg">
								div>
							a>
						div>
					div>
				li>
			ul>
		div>
		
		<div class="page_nav">
			<ul>
				<li>
					<a href="#">首页a>
				li>
				<li>
					<a href="#">上一页a>
				li>
				<li>
					<a href="#">
						<span class="first_page">1span>
					a>
				li>
				<li>
					<a href="#">2a>
				li>
				<li>
					<a href="#">3a>
				li>
				<li>
					<a href="#">4a>
				li>
				<li>
					<a href="#">5a>
				li>
				<li>
					<a href="#">...a>
				li>
				<li>
					<a href="#">98a>
				li>
				<li>
					<a href="#">99a>
				li>
				<li>
					<a href="#">下一页a>
				li>
				<li>
					<a href="#">尾页a>
				li>
			ul>
		div>
	div>
	
	<div class="footer">
		<p>
			<span>M-GALLARYspan>©2020 POWERED BY DODOKE.INC
		p>
	div>
body>
html>

你可能感兴趣的:(Web前端开发工程)

  • 学习threejs，使用自定义GLSL 着色器，生成漂流的3D能量球 gis分享者 gis工程师threejsthreejsGLSLShaderMaterial3D能量球着色器
    ‍⚕️主页：gis分享者‍⚕️感谢各位大佬点赞收藏⭐留言加关注✅!‍⚕️收录于专栏：threejsgis工程师文章目录一、前言1.1☘️GLSL着色器1.1.1☘️着色器类型1.1.2☘️工作原理1.1.3☘️核心特点1.1.4☘️应用场景1.1.5☘️实战示例二、使用自定义GLSL着色器，生成漂流的3D能量球1.☘️实现思路2.☘️代码样例一、前言本文详细介绍如何基于threejs在三维场景中自
  • 关于MiKTex添加外部包setspace的问题 qq_35686293 论文写作
    本人在使用Latex编辑文档时，由于要用到一个setspace的外部包，刚开始的时候，想从MiKTex中自动安装包，不过一直没有安装成功，最后使用了一种超级无敌，暴力的方法，把这个包直接解压在.tex的工程中，发现有时候暴力才能解决问题，哈哈。
  • 全栈运维的“诅咒”与“荣光”：为什么“万金油”工程师是项目成功的隐藏MVP？ 云原生水神 职业发展系统运维运维
    大家好，今天，我们来聊一个特殊且至关重要的群体：运维工程师。特别是那些在项目制中，以一己之力扛起一个或多个产品生死的“全能战士”。你是否就是其中一员？你的技能树上点亮了：操作系统、网络协议、mysql与Redis中间件、Docker与K8s容器化、Ansible与Terraform自动化、Go/Python工具开发、Prometheus监控体系、opentelemetry可视化，甚至要负责信息安全
  • 芯谷科技--双运算放大器D4558 Silicore_Emma 科技运算放大器音频放大音频设备医疗仪器
    在现代电子系统中，运算放大器作为信号处理的核心元件，其性能直接影响到整个系统的稳定性和精度。D4558双运算放大器，凭借其卓越的性能和广泛的应用适配性，为工程师提供了可靠的信号处理解决方案。产品简介D4558是一款由两个高性能运算放大器组成的集成电路，具有高增益、低噪声、高输入阻抗、优秀的通道分离度、宽工作电压范围和内部频率补偿等特点。它支持双电源或单电源工作模式，主要应用于音频信号放大、有源滤波
  • 3DXML 转换为 SOLIDWORKS 技术指南：含迪威模型网在线转换方案
    在工业设计协同工作中，不同CAD软件的文件格式转换是常见需求。3DXML作为DassaultSystèmes旗下CATIA软件的轻量型三维数据格式，因体积小、便于传输，被广泛用于模型预览和跨平台共享。但当需要在SOLIDWORKS中进行深入设计或工程分析时，需将3DXML格式转换为SOLIDWORKS兼容格式。本文将为技术人员和学生详细介绍转换全流程，并推荐实用的在线转换平台——迪威模型网。一、3
  • 使用ENO将您的JSON对象生成HTML显示 土族程序员 jsonhtmljavascripteno前端
    ENO是简单易用，性能卓越，自由灵活开源的WEB前端组件；实现JSON与HTML互操作的JavaScript函数库。没有任何其它依赖，足够轻量。WEBPackNPM工程安装。npminstall@joyzl/eno然后在JS中引用import"@joyzl/eno";将JS实体对象填充到表单假设有一个如下的HTML表单TYPE1TYPE2通过以下代码将实体对象，设置到表单中，实体对象可以从服务器请
  • vue中如何关闭eslint
    方案一:vue脚手架创建工程的时候，不要选择Linter/Formatter选项，（那如何选择启用，请参照方案二）方案二：如果已经选择了eslint，我们可以通过删包的方法来使他失效。在packge.json中，将devDependencies下的关于eslint的依赖包给删除掉。然后退出服务为，重新npmi，在重启服务即可。再次基础上，如果又想使用eslint了。就需要在重新将这几个包手动安装。
  • 网络工程师组网必用，动态路由OSPF及MPLS静态LSP配置 wozuimang ICT网络工程师集训营路由交换网络工程师MPLS
    一、MPLSMPLS基于标签转发，在数据链路层及网络层之间增加MPLS头部，属于2.5层MPLS域中的相关MPLS名词1、LSR标签交换路由器，支持MPLS的路由器2、LER，MPLS边界连接其他网络的LSR设备3、区域内部LSR为核心LSR二、LSR分类1、入站（ingress）LSR：IP报文中压入MPLS头部2、中转（transit）LSR：用于MPLS标签交换，将报文继续MPLS域中转发3
  • 【前端工程化】前端工作中如何协同管理开发任务？ 前端
    在企业级后台系统开发中，任务管理是保障团队协作效率、控制交付质量的核心环节。相比C端产品强调敏捷响应和快速迭代，B端更注重任务拆解的合理性、流程的可控性以及多人协作下的责任清晰。本文主要围绕需求拆解、任务分配、进度跟踪与闭环机制展开，适用于使用Git+PR流程+看板式工具的开发团队。一、任务管理目标职责明确每位成员清楚自己的任务范围与交付标准；避免多人重复处理同一功能模块；可视化进度使用看板或列表
  • 116道网络安全面试真题（附答案），建议收藏！ 程序员肉肉 web安全面试安全网络安全计算机程序员
    116道网络安全面试真题（附答案），建议收藏！随着国家对网络安全的重视度，促使这个职业也变得炙手可热，越来越多的年轻人为进入安全领域在做准备。******数以百计的面试，为何迟迟无法顺利入职？********能力无疑是至关重要的，可却有不少能力不比已入职的同事差却应聘失败的人，那到底该如何做呢？为了帮助大家更快地拿到心仪Offer，我们给小伙伴们整理了一份**《网络安全工程师超高频面试真题》，结合
  • MBSE 深度解析，基于模型的系统工程 北城笑笑 软件工程硬件工程
    目录前言一、基础概述1.1中文全称与基本定义1.2MBSE的起源与背景1.2.1提出的背景与动因1.2.2MBSE的思想萌芽1.3MBSE与传统工程的区别二、发展历程2.1MBSE的演进阶段2.1.1探索期（2000年以前）2.1.1定义期（2000–2010年）2.1.1应用期（2010–2020年）2.1.1智能融合期（2020年至今）2.2主流建模语言与标准2.2主流建模语言与标准2.2.1
  • 计算机网络8832号答案,2013年4月份自考试计算机网络原理04741答案.doc
    2013年4月份自考试计算机网络原理04741答案全国2013年4月高等教育自学考试计算机网络原理试题课程代码：04741请考生按规定用笔将所有试题的答案涂、写在答题纸上。选择题部分1.无线应用协议WAP的特点是A.支持手机上网B.不需要基站C.基于分组交换D.无固定路由器2.智能大厦及计算机网络的信息基础设施是A.通信自动化B.楼宇自动化C.结构化综合布线D.现代通信网络3.因特网工程特别任务组
  • S7-300 400与S7-200 SMART PLC以太网通讯（S7协议）资源文件介绍 滑展妙Bernice
    S7-300400与S7-200SMARTPLC以太网通讯（S7协议）资源文件介绍【下载地址】S7-300400与S7-200SMARTPLC以太网通讯S7协议资源文件介绍本资源文件详细解析了S7-300400与S7-200SMARTPLC通过以太网进行通讯的技术细节，涵盖硬件连接、软件配置及通讯调试等关键环节。通过学习，您将掌握S7协议在PLC通讯中的实际应用，提升自动化与电气工程领域的专业技能
  • 【AI大模型】PyTorch Lightning 简化工具 我爱一条柴ya 学习AI记录人工智能pytorchpythonaiAI编程
    PyTorchLightning是一个轻量级的PyTorch封装库，它通过抽象训练循环的工程细节，让研究人员可以专注于模型设计和实验。以下是PyTorchLightning的核心概念和实战指南。核心优势基础使用：三步搭建训练流程1.定义LightningModuleimporttorchimporttorch.nnasnnimportpytorch_lightningasplfromtorchme
  • 如何创建Python工程目录 九月恒心 Pythonpython自动测试
    如何创建一个简单但是比较规范的python工程目录，本文是学习了LearnPythontheHardWay相关内容后做的一些笔记。安装python第三方包1.pipfromhttp://pypi.python.org/pypi/pip用于安装python第三方包的工具2.distributefromhttp://pypi.python.org/pypi/distribute已被弃用，是SetupT
  • 上下文工程：AI 智能体架构落地的关键新技术 一休哥助手 人工智能人工智能架构
    摘要随着大语言模型（LLM）驱动的智能体（Agent）逐渐成为下一代人机交互的核心范式，上下文管理已成为决定智能体性能与可靠性的关键瓶颈。本文提出“上下文工程”（ContextEngineering）作为智能体架构落地的核心技术方向，系统阐述其在解决长上下文依赖、多轮交互一致性、动态知识更新等挑战中的核心作用。通过分层架构设计、动态压缩策略与向量化增强技术，上下文工程显著提升智能体的记忆效率与推理
  • 从单体脚本到模块化设计：Python工程师的架构思维跃迁
    引言：从“一团乱麻”到“乐高积木”你是否曾经打开一个Python脚本，里面密密麻麻挤着上千行代码？函数相互缠绕，全局变量随处可见，想改一个小功能却心惊胆战，生怕牵一发而动全身？这就是典型的“单体脚本”(MonolithicScript)困境。作为过来人，我深知这种痛苦。本文将手把手带你跳出这个泥潭，掌握模块化设计的核心思想，并初步建立宝贵的架构设计思维，让你的代码从“勉强运行”跃迁到“优雅可维护”
  • MATLAB随机模拟技术在气候模型中的应用
    本文还有配套的精品资源，点击获取简介：MATLAB是科学研究和工程领域中广泛使用的一款数学计算与编程软件，尤其在气象学和气候模拟方面有着重要的应用。’Fletcher_2019_Learning_Climate’项目通过MATLAB实现的随机模拟方法帮助理解气候变化。本文将详细探讨该项目的关键内容，包括气候模型的构成、随机过程与统计方法的运用、MATLAB编程技能、气候数据处理与分析、结果可视化以
  • 《数字集成电路——课程设计报告》资源介绍 幸刚磊Thomas
    《数字集成电路——课程设计报告》资源介绍【下载地址】数字集成电路课程设计报告资源介绍该开源项目提供了《数字集成电路——课程设计报告》的完整资源，专为电子工程及相关专业的学生和研究人员设计。报告详细介绍了与非门、或非门、反相器、主从JK触发器以及二-四译码器等基础逻辑电路的搭建与仿真过程。通过使用Cadence和LTspice软件，学习者可以掌握数字集成电路的实际设计技能。报告内容深入浅出，适合具备
  • ‘parent.relativePath‘ of POM com.xx:xxxxx:1.0-SNAPSHOT points at com.example:zzu_gtp instead 余677 springboot
    在父工程pom文件下添加spring-boot-starter-parentorg.springframework.boot2.7.3变成spring-boot-starter-parentorg.springframework.boot2.7.3然后刷新maven就行了
  • 领域驱动设计核心解析
    我是廖志伟，一名Java开发工程师、《Java项目实战——深入理解大型互联网企业通用技术》（基础篇）、（进阶篇）、（架构篇）清华大学出版社签约作家、Java领域优质创作者、CSDN博客专家、阿里云专家博主、51CTO专家博主、产品软文专业写手、技术文章评审老师、技术类问卷调查设计师、幕后大佬社区创始人、开源项目贡献者。拥有多年一线研发和团队管理经验，研究过主流框架的底层源码(Spring、Spri
  • DDD实践精髓：战略与战术 Java廖志伟 Java场景面试宝典DDDSoftwareArchitectureBusinessLogic
    我是廖志伟，一名Java开发工程师、《Java项目实战——深入理解大型互联网企业通用技术》（基础篇）、（进阶篇）、（架构篇）清华大学出版社签约作家、Java领域优质创作者、CSDN博客专家、阿里云专家博主、51CTO专家博主、产品软文专业写手、技术文章评审老师、技术类问卷调查设计师、幕后大佬社区创始人、开源项目贡献者。拥有多年一线研发和团队管理经验，研究过主流框架的底层源码(Spring、Spri
  • ShardingSphere核心技术揭秘 Java廖志伟 Java场景面试宝典DatabaseShardingDistributedSystemsPerformanceScaling
    我是廖志伟，一名Java开发工程师、《Java项目实战——深入理解大型互联网企业通用技术》（基础篇）、（进阶篇）、（架构篇）清华大学出版社签约作家、Java领域优质创作者、CSDN博客专家、阿里云专家博主、51CTO专家博主、产品软文专业写手、技术文章评审老师、技术类问卷调查设计师、幕后大佬社区创始人、开源项目贡献者。拥有多年一线研发和团队管理经验，研究过主流框架的底层源码(Spring、Spri
  • 大唐杯省赛考纲总结（10%） LUO-CHEn 大唐杯第十届5G信息与通信
    系列文章目录本届大唐杯考察范围20%通信基础知识70%5G内容10%商业流程文章目录系列文章目录前言一、通信基础知识的考察（20%）二、5G内容5G无线技术（20%）：5G网络技术（10%）：5G协议与信令（15%）:5G工程实践（15%）：5G+垂直行业应用（10%）:三、商业流程（10%）:总结前言大唐杯以推广信息通信领域前沿技术、协同高校学科建设、推动行业创新发展为目的，激发高校学生参赛热情
  • 大一新生第一次参加蓝桥杯(C/C++组)，只学C够吗？怎么备赛？个人经验分享 老虎0627 蓝桥杯
    个人感受（唠叨唠叨）我是2023级的物联网工程专业的一名大一新生，在大一的下半学期有幸通过校赛，参加了第十五届蓝桥杯软件赛，其实我自己都没想到大一就能参加蓝桥杯，因为当时只会C语言，也很迷茫，到底该怎么备赛？剩的时间比较少到底要不要学习C++。到底要不要学C++？我在蓝桥杯正式比赛前特别纠结要不要学c++，因为当时省的时间比较少，而且会有担心学c++的一些语法会不会把它跟c语言搞混，到时候在考场忘
  • 如何为Spring Web程序添加log4j功能 yuhaiqiang_123 springlog4jweb
    第一步将log4j-1.2.14.jar这个包加入到WEB-INF/lib下，然后构建路径第二步：在Web.xml，添加如下webAppRootKeyStudy.root红色的字换成你工程名字org.springframework.web.util.Log4jConfigListenerlog4jConfigLocation/WEB-INF/log4j.propertieslog4jRefresh
  • 小架构step系列04：springboot提供的依赖 秋千码途 springboot架构java
    1概述搭建的工程例子中，指定了spring-boot的spring-boot-starter-parent作为，然后在依赖中指定了spring-boot-starter依赖，里面没有指定版本，也没看到有指定核心Spring，却能够正常运行，这是如何工作的？org.springframework.bootspring-boot-starter-parent2.1.18.RELEASEorg.spri
  • 软件工程中耦合度 Da_秀 软件工程开发语言后端架构
    耦合度（Coupling）是软件工程中一个重要的概念，用来衡量软件系统中不同模块或组件之间相互依赖的程度。耦合度越高，意味着模块之间的依赖关系越紧密；耦合度越低，表示模块之间的依赖关系越松散。具体解释如下：高耦合定义：高耦合指的是模块之间相互依赖程度高，一个模块的代码可能频繁地直接调用、修改另一个模块的内部实现细节，或者两个模块之间存在大量的直接交互和数据共享。缺点：难以维护：当一个模块需要修改时
  • Web3区块链有哪些岗位？ VV- Wxiaoxwen 软件工程开源软件软件构建
    Web3区块链领域的岗位丰富多样，涵盖技术开发、产品管理、运营、商务等多个方面，以下是具体介绍：-技术开发类：-智能合约开发工程师：负责编写、审计和优化智能合约，常见于DeFi开发，包括抵押借贷、跨链桥、期货衍生品交易所等合约开发，需精通Solidity等编程语言，熟悉区块链平台特性。-区块链开发工程师：承担公链或应用链开发工作，如L1公链（Bitcoin生态、Ethereum生态等）开发、L2公
  • vue 与 Three.js 结合
    打底：新建vue工程，引入Three.js及其相关插件一、使用vue-cli新建vue工程二、安装Three.js包依赖三、Three.js在vue中的引入方式一、使用vue-cli新建vue工程注意：这里是用vue-cli2.0建立的工程创建一个vue2.0项目，名称叫做vue-three-demo，这里一般创建之后，会自动将依赖包安装完成，若未完成，自己在执行一下npminstall即可。vu
  • iOS http封装 374016526 ios服务器交互http网络请求
    程序开发避免不了与服务器的交互，这里打包了一个自己写的http交互库。希望可以帮到大家。   内置一个basehttp，当我们创建自己的service可以继承实现。   KuroAppBaseHttp *baseHttp = [[KuroAppBaseHttp alloc] init]; [baseHttp setDelegate:self]; [baseHttp
  • lolcat ：一个在 Linux 终端中输出彩虹特效的命令行工具 brotherlamp linuxlinux教程linux视频linux自学linux资料
      那些相信 Linux 命令行是单调无聊且没有任何乐趣的人们，你们错了，这里有一些有关 Linux 的文章，它们展示着 Linux 是如何的有趣和“淘气” 。 在本文中，我将讨论一个名为“lolcat”的小工具 – 它可以在终端中生成彩虹般的颜色。 何为 lolcat ? Lolcat 是一个针对 Linux，BSD 和 OSX 平台的工具，它类似于 cat 命令，并为 cat
  • MongoDB索引管理（1）——[九] eksliang mongodbMongoDB管理索引
    转载请出自出处：http://eksliang.iteye.com/blog/2178427 一、概述       数据库的索引与书籍的索引类似，有了索引就不需要翻转整本书。数据库的索引跟这个原理一样，首先在索引中找，在索引中找到条目以后，就可以直接跳转到目标文档的位置，从而使查询速度提高几个数据量级。       不使用索引的查询称
  • Informatica参数及变量 18289753290 Informatica参数变量
    下面是本人通俗的理解，如有不对之处，希望指正 info参数的设置：在info中用到的参数都在server的专门的配置文件中（最好以parma）结尾 下面的GLOBAl就是全局的，$开头的是系统级变量，$$开头的变量是自定义变量。如果是在session中或者mapping中用到的变量就是局部变量，那就把global换成对应的session或者mapping名字。 [GLOBAL] $Par
  • python 解析unicode字符串为utf8编码字符串 酷的飞上天空 unicode
    php返回的json字符串如果包含中文，则会被转换成\uxx格式的unicode编码字符串返回。 在浏览器中能正常识别这种编码，但是后台程序却不能识别，直接输出显示的是\uxx的字符，并未进行转码。   转换方式如下   >>> import json >>> q = '{"text":"\u4
  • Hibernate的总结 永夜-极光 Hibernate
    1.hibernate的作用,简化对数据库的编码,使开发人员不必再与复杂的sql语句打交道   做项目大部分都需要用JAVA来链接数据库，比如你要做一个会员注册的 页面，那么 获取到用户填写的 基本信后，你要把这些基本信息存入数据库对应的表中，不用hibernate还有mybatis之类的框架，都不用的话就得用JDBC，也就是JAVA自己的，用这个东西你要写很多的代码，比如保存注册信
  • SyntaxError: Non-UTF-8 code starting with '\xc4' 随便小屋 python
    刚开始看一下Python语言，传说听强大的，但我感觉还是没Java强吧！ 写Hello World的时候就遇到一个问题，在Eclipse中写的，代码如下 ''' Created on 2014年10月27日 @author: Logic ''' print("Hello World!");  运行结果 SyntaxError: Non-UTF-8
  • 学会敬酒礼仪 不做酒席菜鸟 aijuans 菜鸟
    俗话说，酒是越喝越厚，但在酒桌上也有很多学问讲究，以下总结了一些酒桌上的你不得不注意的小细节。 细节一：领导相互喝完才轮到自己敬酒。敬酒一定要站起来，双手举杯。 细节二：可以多人敬一人，决不可一人敬多人，除非你是领导。 细节三：自己敬别人，如果不碰杯，自己喝多少可视乎情况而定，比如对方酒量，对方喝酒态度，切不可比对方喝得少，要知道是自己敬人。 细节四：自己敬别人，如果碰杯，一
  • 《创新者的基因》读书笔记 aoyouzi 读书笔记《创新者的基因》
    创新者的基因   创新者的“基因”，即最具创意的企业家具备的五种“发现技能”：联想，观察，实验，发问，建立人脉。   第一部分破坏性创新，从你开始 第一章破坏性创新者的基因 如何获得启示： 发现以下的因素起到了催化剂的作用：(1) -个挑战现状的问题；(2)对某项技术、某个公司或顾客的观察；(3) -次尝试新鲜事物的经验或实验；(4)与某人进行了一次交谈，为他点醒
  • 表单验证技术 百合不是茶 JavaScriptDOM对象String对象事件
    js最主要的功能就是验证表单,下面是我对表单验证的一些理解,贴出来与大家交流交流  ,数显我们要知道表单验证需要的技术点, String对象,事件,函数   一:String对象;通常是对字符串的操作;   1,String的属性;   字符串.length;表示该字符串的长度; var str= "java"
  • web.xml配置详解之context-param bijian1013 javaservletweb.xmlcontext-param
    一.格式定义： <context-param> <param-name>contextConfigLocation</param-name> <param-value>contextConfigLocationValue></param-value> </context-param> 作用：该元
  • Web系统常见编码漏洞（开发工程师知晓） Bill_chen sqlPHPWebfckeditor脚本
    1.头号大敌：SQL Injection 原因：程序中对用户输入检查不严格，用户可以提交一段数据库查询代码，根据程序返回的结果， 获得某些他想得知的数据，这就是所谓的SQL Injection，即SQL注入。 本质: 对于输入检查不充分，导致SQL语句将用户提交的非法数据当作语句的一部分来执行。 示例： String query = "SELECT id FROM users
  • 【MongoDB学习笔记六】MongoDB修改器 bit1129 mongodb
    本文首先介绍下MongoDB的基本的增删改查操作，然后，详细介绍MongoDB提供的修改器，以完成各种各样的文档更新操作  MongoDB的主要操作 show dbs 显示当前用户能看到哪些数据库 use foobar 将数据库切换到foobar show collections 显示当前数据库有哪些集合 db.people.update，update不带参数，可
  • 提高职业素养，做好人生规划 白糖_ 人生
      培训讲师是成都著名的企业培训讲师，他在讲课中提出的一些观点很新颖，在此我收录了一些分享一下。注：讲师的观点不代表本人的观点，这些东西大家自己揣摩。   1、什么是职业规划：职业规划并不完全代表你到什么阶段要当什么官要拿多少钱，这些都只是梦想。职业规划是清楚的认识自己现在缺什么，这个阶段该学习什么，下个阶段缺什么，又应该怎么去规划学习，这样才算是规划。  
  • 国外的网站你都到哪边看？ bozch 技术网站国外
    学习软件开发技术，如果没有什么英文基础，最好还是看国内的一些技术网站，例如：开源OSchina，csdn，iteye,51cto等等。 个人感觉如果英语基础能力不错的话，可以浏览国外的网站来进行软件技术基础的学习，例如java开发中常用的到的网站有apache.org 里面有apache的很多Projects,springframework.org是spring相关的项目网站,还有几个感觉不错的
  • 编程之美-光影切割问题 bylijinnan 编程之美
    package a; public class DisorderCount { /**《编程之美》“光影切割问题” * 主要是两个问题： * 1.数学公式（设定没有三条以上的直线交于同一点）： * 两条直线最多一个交点，将平面分成了4个区域； * 三条直线最多三个交点，将平面分成了7个区域； * 可以推出：N条直线 M个交点，区域数为N+M+1。
  • 关于Web跨站执行脚本概念 chenbowen00 Web安全跨站执行脚本
    跨站脚本攻击(XSS)是web应用程序中最危险和最常见的安全漏洞之一。安全研究人员发现这个漏洞在最受欢迎的网站,包括谷歌、Facebook、亚马逊、PayPal,和许多其他网站。如果你看看bug赏金计划,大多数报告的问题属于 XSS。为了防止跨站脚本攻击,浏览器也有自己的过滤器,但安全研究人员总是想方设法绕过这些过滤器。这个漏洞是通常用于执行cookie窃取、恶意软件传播,会话劫持,恶意重定向。在
  • [开源项目与投资]投资开源项目之前需要统计该项目已有的用户数 comsci 开源项目
            现在国内和国外,特别是美国那边,突然出现很多开源项目,但是这些项目的用户有多少,有多少忠诚的粉丝,对于投资者来讲,完全是一个未知数,那么要投资开源项目,我们投资者必须准确无误的知道该项目的全部情况,包括项目发起人的情况,项目的维持时间..项目的技术水平,项目的参与者的势力,项目投入产出的效益.....
  • oracle alert log file（告警日志文件） daizj oracle告警日志文件alert log file
    The alert log is a chronological log of messages and errors, and includes the following items: All internal errors (ORA-00600), block corruption errors (ORA-01578), and deadlock errors (ORA-00060)
  • 关于 CAS SSO 文章声明 denger SSO
    由于几年前写了几篇 CAS 系列的文章，之后陆续有人参照文章去实现，可都遇到了各种问题，同时经常或多或少的收到不少人的求助。现在这时特此说明几点： 1.  那些文章发表于好几年前了，CAS 已经更新几个很多版本了，由于近年已经没有做该领域方面的事情，所有文章也没有持续更新。 2. 文章只是提供思路，尽管 CAS 版本已经发生变化，但原理和流程仍然一致。最重要的是明白原理，然后
  • 初二上学期难记单词 dcj3sjt126com englishword
    lesson 课 traffic 交通 matter 要紧；事物 happy 快乐的，幸福的 second 第二的 idea 主意；想法；意见 mean 意味着 important 重要的，重大的 never 从来，决不 afraid 害怕 的 fifth 第五的 hometown 故乡，家乡 discuss 讨论；议论 east 东方的 agree 同意；赞成 bo
  • uicollectionview 纯代码布局, 添加头部视图 dcj3sjt126com Collection
    #import <UIKit/UIKit.h> @interface myHeadView : UICollectionReusableView { UILabel *TitleLable; } -(void)setTextTitle; @end #import "myHeadView.h" @implementation m
  • N 位随机数字串的 JAVA 生成实现 FX夜归人 javaMath随机数Random
    /** * 功能描述 随机数工具类<br /> * @author FengXueYeGuiRen * 创建时间 2014-7-25<br /> */ public class RandomUtil { // 随机数生成器 private static java.util.Random random = new java.util.R
  • Ehcache（09）——缓存Web页面 234390216 ehcache页面缓存
    页面缓存 目录 1       SimplePageCachingFilter 1.1      calculateKey 1.2      可配置的初始化参数 1.2.1     cach
  • spring中少用的注解@primary解析 jackyrong primary
    这次看下spring中少见的注解@primary注解，例子 @Component public class MetalSinger implements Singer{ @Override public String sing(String lyrics) { return "I am singing with DIO voice
  • Java几款性能分析工具的对比 lbwahoo java
    Java几款性能分析工具的对比 摘自：http://my.oschina.net/liux/blog/51800   在给客户的应用程序维护的过程中，我注意到在高负载下的一些性能问题。理论上，增加对应用程序的负载会使性能等比率的下降。然而，我认为性能下降的比率远远高于负载的增加。我也发现，性能可以通过改变应用程序的逻辑来提升，甚至达到极限。为了更详细的了解这一点，我们需要做一些性能
  • JVM参数配置大全 nickys jvm应用服务器
    JVM参数配置大全 /usr/local/jdk/bin/java -Dresin.home=/usr/local/resin -server -Xms1800M -Xmx1800M -Xmn300M -Xss512K -XX:PermSize=300M -XX:MaxPermSize=300M -XX:SurvivorRatio=8 -XX:MaxTenuringThreshold=5 -
  • 搭建 CentOS 6 服务器(14) - squid、Varnish rensanning varnish
    （一）squid 安装 # yum install httpd-tools -y # htpasswd -c -b /etc/squid/passwords squiduser 123456 # yum install squid -y 设置 # cp /etc/squid/squid.conf /etc/squid/squid.conf.bak # vi /etc/
  • Spring缓存注解@Cache使用 tom_seed spring
    参考资料 http://www.ibm.com/developerworks/cn/opensource/os-cn-spring-cache/ http://swiftlet.net/archives/774   缓存注解有以下三个： @Cacheable      @CacheEvict     @CachePut
  • dom4j解析XML时出现"java.lang.noclassdeffounderror: org/jaxen/jaxenexception"错误 xp9802
    java.lang.NoClassDefFoundError: org/jaxen/JaxenExc 关键字: java.lang.noclassdeffounderror: org/jaxen/jaxenexception 使用dom4j解析XML时，要快速获取某个节点的数据，使用XPath是个不错的方法，dom4j的快速手册里也建议使用这种方式 执行时却抛出以下异常： Exceptio
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他