前端面试题汇总（含答案）（HTML+CSS篇）

主要自用，持续更新，相同类型的题目尽量放在了一起，参考的实在太多了就没有列出，侵权烦请联系删除。提示：自动生成的目录在页面右边->>>>>>>>>>>>>>>>

1.css选择器优先级

• css选择器的种类

1.标签选择器(如：body,div,p,ul,li)

2.类选择器(如：class="head"class=“head_logo”)

3.ID选择器(如：id=“name”,id=“name_txt”)

4.全局选择器(如：*号)

5.组合选择器(如：.head .head_logo,注意两选择器用空格键分开)

6.后代选择器 (如：#head .nav ul li 从父集到子孙集的选择器)

7.群组选择器 div,span,img {color:Red} 即具有相同样式的标签分组显示

8.继承选择器(如：div p,注意两选择器用空格键分开)

9.伪类选择器(如：就是链接样式,a元素的伪类，4种不同的状态：link、visited、active、hover。)

10.字符串匹配的属性选择符(^ $ *三种，分别对应开始、结尾、包含)

11.子选择器 (如：div>p ,带大于号>)12.CSS 相邻兄弟选择器器 (如：h1+p,带加号+)

• css选择器的优先级

!important > 行内样式>ID选择器 > 类选择器 > 标签 > 通配符 > 继承 > 浏览器默认属性

2.css选择器有哪些？他们的权重

• 内联样式，如: style=“…”，权值为1000。
• ID选择器，如：#content，权值为0100。
• 类，伪类、属性选择器，如.content，权值为0010。
• 类型选择器、伪元素选择器，如div p，权值为0001。
• 通配符、子选择器、相邻选择器等。如* > +，权值为0000。
• 继承的样式没有权值

3.说一下盒模型

https://www.cnblogs.com/qianguyihao/p/7256371.html

盒子模型，英文即box model。无论是div、span、还是a都是盒子。但是，图片、表单元素一律看作是文本，它们并不是盒子。这个很好理解，比如说，一张图片里并不能放东西，它自己就是自己的内容。

一个盒子中主要的属性就5个：width、height、padding、border、margin,宽度和真实占有宽度，不是一个概念,这是因为还要加上padding、border，真实的大小是margin border padding content的大小和，height、width指的都是content的大小

在标准盒子模型中，width 和 height 指的是内容区域的宽度和高度。增加内边距、边框和外边距不会影响内容区域的尺寸，但是会增加元素框的总尺寸。IE盒子模型中，width 和 height 指的是内容区域+border+padding的宽度和高度。

综合属性的写法：(上、右、下、左)（顺时针方向，用空格隔开。margin的道理也是一样的）

4.flex:1什么意思

• CSDN收藏夹：flex:1 == flex:1 1 auto

• flex的三个属性

1.flex-grow:默认为0，指定了flex容器中剩余空间的多少应该被分配给项目

2.flex-shrink:默认为1，仅在默认宽度之和大于容器宽度的时候才会收缩。

3.flex-basis:指定了flex元素在主轴方向上的大小，如果不用box-sizing改变盒模型，这个属性就决定了flex元素的内容尺寸，如果设置了flex-basis,那么元素占用的空间就为这个值，没有设置或auto那么元素占用的就是元素的width/height值

5.哪些方法可以实现水平垂直居中

1.块元素的特点：
a.总是在新行上开始；
b.高度、行高以及外边距和内边距都可控制；
c.宽度默认是它容器的100%，除非设定一个宽度；
d.他可以容纳内联元素和其他块元素。
2.内联元素的特点：
a.和其他元素都在同一行；
b.高，行高及外边距和内边距不可改变；
c.宽度就是它的文字和图片的宽度，不可改变；
d.内联元素只能容纳文本或者其他内联元素。

水平居中

• 1. 若是行内元素, 给其父元素设置 text-align:center,即可实现行内元素水平居中.
• 2. 若是块级元素, 该元素设置 margin:0 auto即可.
• 3. 若子元素包含 float:left 属性, 为了让子元素水平居中, 则可让父元素宽度设置为fit-content,并且配合margin, 作如下设置:
     .parent{
     width: -moz-fit-content;
     width: -webkit-fit-content;
     width:fit-content;
     margin:0 auto;
     }
     fit-content是CSS3中给width属性新加的一个属性值,它配合margin可以轻松实现水平居中, 目前只支持Chrome 和 Firefox浏览器.
• 4. 使用flex 2012年版本布局, 可以轻松的实现水平居中, 子元素设置如下:

.son{
    display: flex;
    justify-content: center;
}

• 5. 使用CSS3中新增的transform属性, 子元素设置如下:

.son{
    position:absolute;
    left:50%;
    transform:translate(-50%,0);
}

• 6. 使用绝对定位方式, 以及负值的margin-left, 子元素设置如下:

.son{
    position:absolute;
    width:固定;
    left:50%;
    margin-left:-0.5宽度;
}

• 7. 使用绝对定位方式, 以及left:0;right:0;margin:0 auto; 子元素设置如下:

.son{
    position:absolute;
    width:固定;
    left:0;
    right:0;
    margin:0 auto;
}

垂直居中

单行文本

• 1. 若元素是单行文本, 则可设置 line-height 等于父元素高度

行内块级元素

• 2. 若元素是行内块级元素, 基本思想是使用display: inline-block, vertical-align: middle(该属性定义行内元素的基线相对于该元素所在行的基线的垂直对齐)和一个伪元素让内容块处于容器中央.

.parent::after, .son{
    display:inline-block;
    vertical-align:middle;
}
.parent::after{
    content:'';
    height:100%;
}

• 3. 可用 vertical-align 属性, 而vertical-align只有在父层为 td 或者 th 时, 才会生效, 对于其他块级元素, 例如 div、p 等, 默认情况是不支持的. 为了使用vertical-align, 我们需要设置父元素display:table, 子元素 display:table-cell;vertical-align:middle;

优点

元素高度可以动态改变, 不需再CSS中定义, 如果父元素没有足够空间时, 该元素内容也不会被截断.

缺点

IE6~7, 甚至IE8 beta中无效.

• 4. 可用 Flex 2012版, 这是CSS布局未来的趋势. Flexbox是CSS3新增属性, 设计初衷是为了解决像垂直居中这样的常见布局问题
     父元素做如下设置即可保证子元素垂直居中:

.parent {
  display: flex;
  align-items: center;
}

优点

内容块的宽高任意, 优雅的溢出.
可用于更复杂高级的布局技术中.

缺点

IE8/IE9不支持
需要浏览器厂商前缀
渲染上可能会有一些问题

• 5. 使用flex 2009版.

.parent {
    display: box;
    box-orient: vertical;
    box-pack: center;
}

优点

实现简单, 扩展性强

缺点

兼容性差, 不支持IE

• 6. 可用 transform , 设置父元素相对定位(position:relative), 子元素如下css样式:

.son{
    position:absolute;
    top:50%;
    -webkit-transform: translate(-50%,-50%); 
    -ms-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}

优点

代码量少

缺点

IE8不支持, 属性需要追加浏览器厂商前缀, 可能干扰其他 transform 效果, 某些情形下会出现文本或元素边界渲染模糊的现象.

元素高度固定

• 7. 设置父元素相对定位(position:relative), 子元素如下css样式:

.son{
    position:absolute;
    top:50%;
    height:固定;
    margin-top:-0.5高度;
}

优点

适用于所有浏览器.

缺点

父元素空间不够时, 子元素可能不可见(当浏览器窗口缩小时,滚动条不出现时).如果子元素设置了overflow:auto, 则高度不够时, 会出现滚动条.

• 8. 设置父元素相对定位(position:relative), 子元素如下css样式:

.son{
    position:absolute;
    height:固定;
    top:0;
    bottom:0;
    margin:auto 0;
}

优点

简单

缺点

没有足够空间时, 子元素会被截断, 但不会有滚动条.

总结

水平居中较为简单, 共提供了8种方法, 一般情况下 text-align:center,marin:0 auto; 足矣

① text-align:center;
② margin:0 auto;
③ width:fit-content;
④ flex
⑤ 盒模型
⑥ transform
⑦ ⑧ 两种不同的绝对定位方法
垂直居中, 共提供了8种方法.

① 单行文本, line-height
② 行内块级元素, 使用 display: inline-block, vertical-align: middle; 加上伪元素辅助实现
③ vertical-align
④ flex
⑤ 盒模型
⑥ transform
⑦ ⑧ 两种不同的绝对定位方法

我们发现, flex, 盒模型, transform, 绝对定位, 这几种方法同时适用于水平居中和垂直居中.

6.Flex相关

https://www.ruanyifeng.com/blog/2015/07/flex-grammar.html

• flex是FlexibleBox的缩写意思为弹性布局，用来为盒状模型提供最大的灵活性，flex布局子元素的float、clear、vertical-align属性失效

• 属性值

1.flex-direction：决定项目的排列方向包括row|row-reverse|column|column-reverse

2.flex-wrap：默认为一条线，它定义如果拍不下如何换行包括nowrap|wrap|wrap-reverse(第一行在下方)

3.flex-flow：是前两个的简写形式即 ||

4.justify-content：项目在主轴上的对齐方式包括flex-start|flex-end|center|space-between|space-around(元素之间的间隔比与边框之间的间隔大一倍)

5.align-items：定义项目在交叉轴（一根轴线）上如何对齐flex-start|flex-end|center|baseline(平均在一条线上)|strech

6.align-content：多根轴线的对齐方式，只有一根不起作用包括flex-start|flex-end|center|space-between|space-around（每根轴线两侧的间隔都相等。所以，轴线之间的间隔比轴线与边框的间隔大一倍）|strech

7.order：定义项目的排列顺序，数值越小越靠前默认为0

8.flex：flex-grow|flex-shrink|flex-basis默认1 0 auto，三个属性值可单独写但不推荐，auto:1 1 auto(即自动铺满),none:0 0 auto(不能伸缩)

9align-self：允许单个和其他的项目不一样的对齐方式，可以覆盖align-items，默认auto，值与align-items一样

7.除了flex布局还有哪些布局

• flex只兼容ie10以上的浏览器(最大痛点),而且老版的flex的写法还不一样，一会儿display:box,一会儿display:flex,还要做兼容处理。
• table布局

8.transform介绍一下

http://www.divcss5.com/css3-style/c55513.shtml

Transform字面上就是变形，改变的意思。在CSS3中transform主要包括以下几种：旋转rotate、扭曲skew、缩放scale和移动translate以及矩阵变形matrix。

//transform中使用多个属性时却需要有空格隔开
transform ： none |  [  ]* 

transform: rotate | scale | skew | translate |matrix;

• 1.rotate() ：通过指定的角度参数对原元素指定一个2D rotation（2D 旋转），需先有transform-origin属性的定义。transform-origin定义的是旋转的基点，其中angle是指旋转角度，如果设置的值为正数表示顺时针旋转，如果设置的值为负数，则表示逆时针旋转。如：transform:rotate(30deg)

//使元素围绕X轴、Y轴、Z轴旋转
transform：rotateX（45deg）；
 
transform：rotateY（45deg）；
 
transform：rotateZ（45deg）；
 
transform：rotateX（45deg）rotateY（45deg）rotateZ（45deg）；
 
transform：scale（0.5）rotateY（45deg）rotateZ（45deg）；

• 2.translate(x,y)水平方向和垂直方向同时移动（也就是X轴和Y轴同时移动）；translateX(x)仅水平方向移动（X轴移动）；translateY(Y)仅垂直方向移动（Y轴移动）

transform：translate（50px，50px）；//水平方向上移动50px，垂直方向上移动50px
transform：translate（50px）；//这种情况下视为只在水平方向上移动，垂直方向上不移动。
//使元素在X轴、Y轴、Z轴方向上进行移动
transform：translateX（50px）;
transform：translateY（50px）;
transform：translateZ（50px）;

• 3.transform：scale（0.5，2）；//水平方向缩小一半，垂直方向放大一倍。

transform：scale（0.5）；//缩小一半
transform：scale（0.5，2）；//水平方向缩小一半，垂直方向放大一倍。
//按X轴、Y轴、Z轴进行缩放
transform：scaleX（0.5）；
transform：scaleY（1）；
transform：scaleZ（2）；
transform：scaleX（0.5）scaleY（1）；
transform：scale（0.5）rotateY（45deg）；

• 4.使用skew方法实现文字或图像的倾斜处理，在参数中分别指定水平方向上的倾斜角度与垂直方向上的倾斜角度。

transform：skew（30deg，30deg）；//水平方向上倾斜30度，垂直方向上倾斜30度。
transform：skew（30deg）//这种情况下视为只在水平方向上进行倾斜，垂直方向上不倾斜。
transform：skewX（45deg）；
transform：skewY（45deg）；

• 5.对一个元素使用多种变形的方法

transform：translate（150px，200px）rotate（45deg）scale（1.5）；

• 6.指定变形的基准点(在使用transform方法进行文字或图像变形的时候，是以元素的中心点为基准点进行变形的。)

transform：rotate（45deg）；
transform-origin：leftbottom；//把基准点修改为元素的左下角
//基准点在元素水平方向上的位置：left、center、right
//基准点在元素垂直方向上的位置：top、center、bottom

9.介绍position

CSS position属性用于指定一个元素在文档中的定位方式。top、right、bottom、left 属性则决定了该元素的最终位置。

窗体自上而下分成一行一行，并在每行中按从左至右的顺序排放元素；每个非浮动块级元素都独占一行， 浮动元素则按规定浮在行的一端，若当前行容不下，则另起新行再浮动；内联元素也不会独占一行，几乎所有元素(包括块级，内联和列表元素）均可生成子行，用于摆放子元素；有三种情况将使得元素脱离normal flow而存在，分别是 float，absolute ，fixed，但是在IE6中浮动元素也存在于normal flow中。

• position: static(默认)

该关键字指定元素使用正常的布局行为，即元素在文档常规流中当前的布局位置。此时 top、right、bottom、left 属性无效。

• position: relative

该关键字下，元素先放置在未添加定位时的位置，再在不改变页面布局的前提下调整元素位置（因此会在此元素未添加定位时所在位置留下空白）。position:relative 对 table-*-group, table-row, table-column, table-cell, table-caption 元素无效。

• position: absolute

不为元素预留空间，通过指定元素相对于最近的非 static 定位祖先元素的偏移，来确定元素位置。绝对定位的元素可以设置外边距（margin），且不会与其他边距合并。

• position: fixed

不为元素预留空间，而是通过指定元素相对于屏幕视口（viewport）的位置来指定元素位置。元素的位置在屏幕滚动时不会改变。打印时，元素会出现在的每页的固定位置。fixed属性会创建新的层叠上下文。当元素祖先的 transform 属性非 none 时，容器由视口改为该祖先。个人理解：fixed相对于window固定，滚动浏览器窗口并不会使其移动，会脱离normal flow。

• position: sticky

盒位置根据正常流计算(这称为正常流动中的位置)，然后相对于该元素在流中的 flow root（BFC）和 containing block（最近的块级祖先元素）定位。在所有情况下（即便被定位元素为 table时），该元素定位均不对后续元素造成影响。当元素 B 被粘性定位时，后续元素的位置仍按照 B 未定位时的位置来确定。position: sticky对 table元素的效果与 position: relative 相同。

• position: inherit

规定应该从父元素继承 position 属性的值。

10.img src为什么不能用空 应该用什么

img标签src为空的陷阱

出现一次这样的标签会导致向你的服务器多做一次请求。

• 在IE中，这样做会请求一次当前页面所在的目录。如在http://playgoogle.com/demo/a.html 中出现这种空src的标签，会导致重新请求一次://playgoogle.com/demo/

• 在Safari 和 Chrome中，将请求当前页面本身。

• 在Firefox 3.5以前的版本中，有和Safari同样的问题，但是在3.5中修正了这个BUG。

• 在Opera 中，不会做额外的请求。

在一个访问量不高的网站中，多一个这样的请求也无所谓（甚至可以让你的网站浏览看上去翻番），但在一个千万级访问量甚至更高的WEB站点里，这样会导致你的服务器和带宽的成本显著增加。 另外一个隐患是，重新请求某个页面可能会导致用户的一些信息被无意中修改，例如cookies，或者ajax操作。

其他的标签中的空src会不会导致这样的问题？ 好消息是，在IE中只有image标签有这个问题。坏消息是，在Chrome, Safari, 和 Firefox中

• 媒体查询

媒体查询可以让我们根据设备显示器的特性（如视口宽度、屏幕比例、设备方向：横向或纵向）为其设定CSS样式，媒体查询由媒体类型和一个或多个检测媒体特性的条件表达式组成。

/* 大屏幕 */
@media only screen and (min-width:1200px) {
}
/* 中等屏幕 */
@media only screen and (min-width: 992px)and (max-width: 1199px) {
}
/* 小屏幕 */

页面大于 768px， 小于 991px 时显示的样式效果

@media only screen and (min-width: 768px)and (max-width: 991px) {
}
/* 手机端显示 */
屏幕小于 767px 时的样式
@media only screen and (max-width: 767px) {
}

• 响应式布局

用百分比去写元素的宽度不要写绝对宽度，让子元素撑起父元素的高度不写绝对高度，字体使用相对大小em或rem

h1 {
    font-size: 2rem;
}

1.浏览器默认字体为 16px ，2rem 即 2 * 16px = 32px
2.em（font size of the element）是指相对于父元素的字体大小的单位，如当前对行内文本的字体尺寸未被人为设置，则相对于浏览器的默认字体尺寸，因此 em 的大小并不是固定的
3.rem是指相对于根元素的字体大小的单位,目前，除了IE8及更早版本外，所有浏览器均已支持rem。
对于不支持它的浏览器，应对方法也很简单，就是多写一个绝对单位的声明。
这些浏览器会忽略用rem设定的字体大小。
h1 {
    font-size: 32px;
    font-size: 2rem;
}

12.form表单包括哪些

• 普通文本框：

• 密码框：

• 单选按钮：

• 多选框：

• 下拉菜单：

　　
　　描述
　　描述
　　

• 按钮：

　　//提交按钮：
　　
　　//图片提交：
　　
　　//普通按钮：没有任何意义的按钮，和js关联使用
　　
　　//重置按钮：
　　
　　//隐藏域：在浏览器中看不到的传递数据表单
　　
　　//多行文本域：
　　

13.html标签的一些共有的属性有哪些

• id：用来给标签取一个唯一的名称。id名称在一个网页必须是唯一的。

• class：用来给标签取一个类名。

• style：用来设置该标签的行内样式。

• title：当鼠标移到该标签，所显示的提示内容

14.html5的新特性

• 语义化标签（为页面提供了更好的页面结构。）

	 //定义文档的头部区域
	//定义文档的尾部区域
	//定义文档的导航区域
	//定义文档的段落
	//定义页面独立的内容区域
	//定义页面侧边栏内容
	//定义命令按钮
	//标签包含 details 元素的标题
	//定义对话框

• 增强型表单(多个新的表单输入类型)

//类型
color	//主要用于选取颜色
date	//从一个日期选择器选择一个日期
datetime	//选择一个日期（UTC 时间）
datetime-local	//选择一个日期和时间 (无时区)
email	//包含 e-mail 地址的输入域
month	//选择一个月份
number	//数值的输入域
range	//一定范围内数字值的输入域
search	//用于搜索域
tel	//定义输入电话号码字段
time	//选择一个时间
url	 //URL 地址的输入域
week	//选择周和年

//新的表单属性
//1.placehoder 属性，简短的提示在用户输入值前会显示在输入域上。即我们常见的输入框默认提示，在用户输入后消失。
//2、required  属性，是一个 boolean 属性。要求填写的输入域不能为空
//3、pattern 属性，描述了一个正则表达式用于验证 元素的值。
//4、min 和 max 属性，设置元素最小值与最大值。
//5、step 属性，为输入域规定合法的数字间隔。
//6、height 和 width 属性，用于 image 类型的  //标签的图像高度和宽度。
//7、autofocus 属性，是一个 boolean 属性。规定在页面加//载时，域自动地获得焦点。
//8、multiple 属性 ，是一个 boolean 属性。规定 元素中可选择多个值。

• 音频和视频

• canvas 绘图
  (见canvas绘图相关)

• SVG 绘图（可伸缩的矢量图形）

SVG 是一种使用 XML 描述 2D 图形的语言。Canvas 通过 JavaScript 来绘制 2D 图形。SVG 基于 XML，这意味着 SVG DOM 中的每个元素都是可用的。您可以为某个元素附加 JavaScript 事件处理器。在 SVG 中，每个被绘制的图形均被视为对象。如果 SVG 对象的属性发生变化，那么浏览器能够自动重现图形。Canvas 是逐像素进行渲染的。在 canvas 中，一旦图形被绘制完成，它就不会继续得到浏览器的关注。如果其位置发生变化，那么整个场景也需要重新绘制，包括任何或许已被图形覆盖的对象。

• 地理定位（Geolocation用于定位用户的位置）

window.navigator.geolocation {
    getCurrentPosition:  fn  用于获取当前的位置数据
    watchPosition: fn  监视用户位置的改变
    clearWatch: fn  清除定位监视
}　　　

navigator.geolocation.getCurrentPosition(
    function(pos){
　　　　console.log('用户定位数据获取成功')
　　　　//console.log(arguments);
　　　　console.log('定位时间：',pos.timestamp)
　　　　console.log('经度：',pos.coords.longitude)
　　　　console.log('纬度：',pos.coords.latitude)
　　　　console.log('海拔：',pos.coords.altitude)
　　　　console.log('速度：',pos.coords.speed)

},    //定位成功的回调
function(err){ 
　　　　console.log('用户定位数据获取失败')
　　　　//console.log(arguments);

}        //定位失败的回调
)

• 拖放API(任何元素都能够拖放)

在HTML5中，拖拽(draganddrop)成为了标准操作，任何元素都支持。

//设置元素可拖放

//拖动什么 - ondragstart 和 setData()
function drag(ev)
{
ev.dataTransfer.setData("Text",ev.target.id);
}
//放到何处 - ondragover
event.preventDefault()
//进行放置 - ondrop
function drop(ev)
{
ev.preventDefault();
var data=ev.dataTransfer.getData("Text");
ev.target.appendChild(document.getElementById(data));
}
//拖放(Drag 和 Drop)各属性生命周期
//拖动开始	ondragstart	script
//拖动过程中	ondrag	script
//拖动过程中	ondragenter	script
//拖动过程中	ondragover	script
//拖动过程中	ondragleave	script	
//拖动结束	ondrop	script	
//拖动结束	ondragend

//写在哪呢？
//被拖放的元素


//目标元素

                        

• Web Storage

//localStorage ：没有时间限制的数据存储
//sessionStorage ： 针对一个 session 的数据存储, 当用户关闭浏览器窗口后，数据会被删除。
//常用的API
//1、保存数据：localStorage.setItem(key,value);
//2、读取数据：localStorage.getItem(key);
//3、删除单个数据：localStorage.removeItem(key);
//4、删除所有数据：localStorage.clear();
//5、得到某个索引的key：localStorage.key(index);

• WebSocket

WebSocket 是HTML5开始提供的一种在单个 TCP 连接上进行全双工通讯的协议。在WebSocket API中，浏览器和服务器只需要做一个握手的动作，然后，浏览器和服务器之间就形成了一条快速通道。两者之间就直接可以数据互相传送。

浏览器通过 JavaScript 向服务器发出建立 WebSocket 连接的请求，连接建立以后，客户端和服务器端就可以通过 TCP 连接直接交换数据。

当你获取 Web Socket 连接后，你可以通过 send() 方法来向服务器发送数据，并通过 onmessage 事件来接收服务器返回的数据。

   
   
   
    
      
   
   
      

         运行 WebSocket
      
   

iframe

iframe标签能解决在一个页面张添加不同的HTML文件，选择不同的地址可以进入不同的页面中去，在同一个页面中修改其中某一块的内容来达到菜单切换的效果

1.name：内嵌帧的名称

2.width：内嵌帧的宽度（可用像素值和百分比）

3.height：内嵌帧的高度（可用像素值和百分比）

4.frameborder：内嵌帧的边框，一般设置为0

5.scrolling：是否出现滚动条（auto为自动，yes为显示，no为不显示）

6.src：内嵌入文件的地址

//高度自适应设置

                    
                    

                

你可能感兴趣的:(前端开发,css,html5,css3)

• DIV+CSS+JavaScript技术制作网页（旅游主题网页设计与制作）云南大理 STU学生网页设计 网页设计期末网页作业html静态网页html5期末大作业网页设计web大作业
  ️精彩专栏推荐作者主页:【进入主页—获取更多源码】web前端期末大作业：【HTML5网页期末作业(1000套)】程序员有趣的告白方式：【HTML七夕情人节表白网页制作(110套)】文章目录二、网站介绍三、网站效果▶️1.视频演示2.图片演示四、网站代码HTML结构代码CSS样式代码五、更多源码二、网站介绍网站布局方面：计划采用目前主流的、能兼容各大主流浏览器、显示效果稳定的浮动网页布局结构。网站程
• 关于城市旅游的HTML网页设计——(旅游风景云南 5页)HTML+CSS+JavaScript 二挡起步 web前端期末大作业javascripthtmlcss旅游风景
  ⛵源码获取文末联系✈Web前端开发技术描述网页设计题材，DIV+CSS布局制作,HTML+CSS网页设计期末课程大作业|游景点介绍|旅游风景区|家乡介绍|等网站的设计与制作|HTML期末大学生网页设计作业，Web大学生网页HTML：结构CSS：样式在操作方面上运用了html5和css3，采用了div+css结构、表单、超链接、浮动、绝对定位、相对定位、字体样式、引用视频等基础知识JavaScrip
• HTML网页设计制作大作业（div+css） 云南我的家乡旅游景点 带文字滚动 二挡起步 web前端期末大作业web设计网页规划与设计htmlcssjavascriptdreamweaver前端
  Web前端开发技术描述网页设计题材，DIV+CSS布局制作,HTML+CSS网页设计期末课程大作业游景点介绍|旅游风景区|家乡介绍|等网站的设计与制作HTML期末大学生网页设计作业HTML：结构CSS：样式在操作方面上运用了html5和css3，采用了div+css结构、表单、超链接、浮动、绝对定位、相对定位、字体样式、引用视频等基础知识JavaScript：做与用户的交互行为文章目录前端学习路线
• webpack图片等资源的处理 dmengmeng
  需要的loaderfile-loader（让我们可以引入这些资源文件）url-loader（其实是file-loader的二次封装）img-loader（处理图片所需要的）在没有使用任何处理图片的loader之前，比如说css中用到了背景图片，那么最后打包会报错的，因为他没办法处理图片。其实你只想能够使用图片的话。只加一个file-loader就可以，打开网页能准确看到图片。{test:/\.(p
• 微信小程序开发注意事项 jun778895 微信小程序小程序
  微信小程序开发是一个融合了前端开发、用户体验设计、后端服务（可选）以及微信小程序平台特性的综合性项目。这里，我将详细介绍一个典型的小程序开发项目的全过程，包括项目规划、设计、开发、测试及部署上线等各个环节，并尽量使内容达到或超过2000字的要求。一、项目规划1.1项目背景与目标假设我们要开发一个名为“智慧校园助手”的微信小程序，旨在为学生提供一站式校园生活服务，包括课程表查询、图书馆座位预约、食堂
• 字节二面 Redstone Monstrosity 前端面试
  1.假设你是正在面试前端开发工程师的候选人，面试官让你详细说出你上一段实习过程的收获和感悟。在上一段实习过程中，我获得了宝贵的实践经验和深刻的行业洞察，以下是我的主要收获和感悟：一、专业技能提升框架应用熟练度：通过实际项目，我深入掌握了React、Vue等前端框架的使用，不仅提升了编码效率，还学会了如何根据项目需求选择合适的框架。问题解决能力：在实习期间，我遇到了许多预料之外的技术难题。通过查阅文
• 《HTML 与 CSS—— 响应式设计》 陈在天box htmlcss前端
  一、引言在当今数字化时代，人们使用各种不同的设备访问互联网，包括智能手机、平板电脑、笔记本电脑和台式机等。为了确保网站在不同设备上都能提供良好的用户体验，响应式设计成为了网页开发的关键。HTML和CSS作为网页开发的基础技术，在实现响应式设计方面发挥着重要作用。本文将深入探讨HTML与CSS中的响应式设计原理、方法和最佳实践。二、响应式设计的概念与重要性（一）概念响应式设计是一种网页设计方法，旨在
• uniapp实现动态标记效果详细步骤【前端开发】 2401_85123349 uni-app
  第二个点在于实现将已经被用户标记的内容在下一次获取后刷新它的状态为已标记。这是什么意思呢？比如说上面gif图中的这些人物对象，有一些已被该用户添加为关心，那么当用户下一次进入该页面时，这些已经被添加关心的对象需要以“红心”状态显现出来。这个点的难度还不算大，只需要在每一次获取后端的内容后对标记对象进行状态更新即可。II.动态标记效果实现思路和步骤首先，整体的思路是利用动态类名对不同的元素进行选择。
• html+css网页设计 旅游网站首页1个页面 html+css+js网页设计 htmlcss旅游
  html+css网页设计旅游网站首页1个页面网页作品代码简单，可使用任意HTML辑软件（如：Dreamweaver、HBuilder、Vscode、Sublime、Webstorm、Text、Notepad++等任意html编辑软件进行运行及修改编辑等操作）。获取源码1，访问该网站https://download.csdn.net/download/qq_42431718/897527112，点击
• css设置当字数超过限制后以省略号（...）显示 周bro css前端vuecss3html经验分享
  1、文字超出一行，省略超出部分，显示’…’用text-overflow:ellipsis属性来，当然还需要加宽度width属来兼容部分浏览。overflow:hidden;text-overflow:ellipsis;white-space:nowrap;2、多行文本溢出显示省略号display:-webkit-box;-webkit-box-orient:vertical;-webkit-lin
• 360前端星计划-动画可以这么玩 马小蜗
  动画的基本原理定时器改变对象的属性根据新的属性重新渲染动画functionupdate(context){//更新属性}constticker=newTicker();ticker.tick(update,context);动画的种类1、JavaScript动画操作DOMCanvas2、CSS动画transitionanimation3、SVG动画SMILJS动画的优缺点优点：灵活度、可控性、性能
• h5小游戏定制开发 红匣子实力推荐
  随着科技的不断发展，移动互联网已经成为人们生活中不可或缺的一部分。在这个背景下，H5小游戏应运而生，为人们带来了丰富的娱乐体验。H5小游戏定制开发作为一种新兴的游戏开发方式，正逐渐受到市场的关注和青睐。那么，什么是H5小游戏定制开发呢？它又具有哪些特点和优势呢？让我们一起来深入了解一下。首先，我们来了解一下H5小游戏的基本概念。H5小游戏是一种基于HTML5技术的游戏，可以在移动端、PC端等多平台
• css2中的透明 琪33
  .out{width:400px;height:400px;background-color:blue;margin:100pxauto;border:1pxsolid#000;opacity:0.6;}.in{width:200px;height:200px;background-color:red;margin:100pxauto;}
• Nginx从入门到实践(三) 听你讲故事啊
  动静分离动静分离是将网站静态资源（JavaScript，CSS，img等文件）与后台应用分开部署，提高用户访问静态代码的速度，降低对后台应用访问。动静分离的一种做法是将静态资源部署在nginx上，后台项目部署到应用服务器上，根据一定规则静态资源的请求全部请求nginx服务器，达到动静分离的目标。rewrite规则Rewrite规则常见正则表达式Rewrite主要的功能就是实现URL的重写，Ngin
• Nginx的使用场景：构建高效、可扩展的Web架构 张某布响丸辣 nginx前端架构
  Nginx，作为当今最流行的Web服务器和反向代理软件之一，凭借其高性能、稳定性和灵活性，在众多Web项目中扮演着核心角色。无论是个人博客、中小型网站，还是大型企业级应用，Nginx都能提供强大的支持。本文将探讨Nginx的几个主要使用场景，帮助读者理解如何在实际项目中充分利用Nginx的优势。1.静态文件服务对于包含大量静态文件（如HTML、CSS、JavaScript、图片等）的网站，Ngin
• Python精选200Tips：121-125 AnFany Python200+Tipspython开发语言
  Spendyourtimeonself-improvement121Requests-简化的HTTP请求处理发送GET请求发送POST请求发送PUT请求发送DELETE请求会话管理处理超时文件上传122BeautifulSoup-网页解析和抓取解析HTML和XML文档查找单个标签查找多个标签使用CSS选择器查找标签提取文本修改文档内容删除标签处理XML文档123Scrapy-强大的网络爬虫框架示例
• 前端CSS面试常见题 剑亦未配妥 前端面试前端css面试
  边界塌陷盒模型有两种：W3C盒模型和IE盒模型，区别在于宽度是否包含边框定义：同时给兄弟/父子盒模型设置上下边距，理论上边距值是两者之和，实际上不是注意：浮动和定位不会产生边界塌陷；只有块级元素垂直方向才会产生margin合并margin计算方案margin同为正负：取绝对值大的值一正一负：求和父子元素边界塌陷解决父元素可以通过调整padding处理；设置overflowhidden，触发BFC子
• 爬虫技术抓取网站数据 Bearjumpingcandy 爬虫
  爬虫技术是一种自动化获取网站数据的技术，它可以模拟人类浏览器的行为，访问网页并提取所需的信息。以下是爬虫技术抓取网站数据的一般步骤：发起HTTP请求：爬虫首先会发送HTTP请求到目标网站，获取网页的内容。解析HTML：获取到网页内容后，爬虫会使用HTML解析器解析HTML代码，提取出需要的数据。数据提取：通过使用XPath、CSS选择器或正则表达式等工具，爬虫可以从HTML中提取出所需的数据，如文
• 创建一个完整的购物商城系统是一个复杂的项目，涉及前端（用户界面）、后端（服务器逻辑）、数据库等多个部分。由于篇幅限制，我无法在这里提供一个完整的系统代码，但我可以分别给出一些关键部分的示例代码，涵盖几 uthRaman 前端ui服务器
  前端（HTML/CSS/JavaScript）grsyzp.cnHTML页面结构（index.html）html购物商城欢迎来到购物商城JavaScript（Ajax请求商品数据，app.js）javascriptdocument.addEventListener('DOMContentLoaded',function(){fetch('/api/products').then(response=
• 了解 UNPKG：前端开发者的包管理利器 小于负无穷 前端javascripttypescriptcsshtml5node.js
  在现代前端开发中，JavaScript包管理和模块化是至关重要的，而npm则是最流行的JavaScript包管理器之一。不过，随着前端项目复杂性的增加，有时候我们希望快速引入外部依赖，而无需本地安装和构建。此时，CDN（内容分发网络）成为了一种方便快捷的解决方案，而UNPKG就是这种方式中的佼佼者。什么是UNPKG？UNPKG是一个基于npm的内容分发网络（CDN），它允许开发者直接通过URL从n
• HTML中"bgcolor"与"background-color"的区别 Sardar_ html
  bgcolor只是标签属性，而backgroud更多作为css的样式属性。它们俩大多数情况下效果完全相同。但在标签下效果不同。不支持bgcolor属性，只能用style标签添加CSS样式。作为table的属性而言：HelloWorld!和HelloWorld!效果完全相同。作为body属性而言：效果完全相同。不过个人推荐统一用CSS样式进行控制，把style统一放到.css文件中。backgrou
• 2019-05-29 vue-router的两种模式的区别 Kason晨
  1、大家都知道vue是一种单页应用,单页应用就是仅在页面初始化的时候加载相应的html/css/js一单页面加载完成,不会因为用户的操作而进行页面的重新加载或者跳转,用javascript动态的变化html的内容优点:良好的交互体验,用户不需要刷新页面,页面显示流畅,良好的前后端工作分离模式,减轻服务器压力,缺点:不利于SEO,初次加载耗时比较多2、hash模式vue-router默认的是hash
• 系列3：【深入】qiankun动态与按需加载子应用—像电影一样控制出现时机 rabbit_it qiankun学习前端框架前端阿里云
  一、引言：为何需要动态加载在现代前端开发中，性能优化始终是一个关键问题。对于微前端架构而言，管理多个子应用带来了前所未有的灵活性，但也对资源的加载和使用效率提出了更高要求。假设你的微前端项目就像一场电影，而子应用是场景或演员。在不同的情节中，我们只需要特定的场景和演员出现，而不需要所有场景和演员一开始就站在舞台上等待。这时，动态加载和按需加载就成为了关键工具——让需要的内容在正确的时机上场，节省性
• 清除 Conda 缓存 Dmatteratall conda缓存
  清除Conda缓存：cssCopycodecondaclean--allcondaclean--all命令将会清除Conda缓存和临时文件，而不会删除已经安装的软件包和环境。它主要用于清理不必要的缓存和临时文件以释放磁盘空间。
• Nuxt Kit 自动导入功能：高效管理你的模块和组合式函数 qcidyu 好用的工具集合代码效率前端技巧Vue开发组合式函数模块管理自动导入NuxtKit
  title:NuxtKit自动导入功能：高效管理你的模块和组合式函数date:2024/9/14updated:2024/9/14author:cmdragonexcerpt:通过使用NuxtKit的自动导入功能，您可以更高效地管理和使用公共函数、组合式函数和VueAPI。无论是单个导入、目录导入还是从第三方模块导入，您都可以通过简单的API调用轻松实现。categories:前端开发tags:N
• electron多标签页模式更像客户端 diygwcom electronjavascript前端
  Electron多标签页模式是指在Electron框架中实现的类似Web浏览器的多标签页功能。Electron是一个使用Web技术（HTML、CSS和JavaScript）来创建跨平台桌面应用程序的框架。在Electron中实现多标签页模式，通常需要借助一些特定的库或组件，如BrowserView或electron-tabs，或者通过自定义实现。实现方式1.使用BrowserViewBrowser
• 外卖霸王餐返利外卖会员卡小程序开发 闹小艾 good506070微信小程序小程序
  外卖霸王餐返利外卖会员卡小程序开发"社交电商赋能下的外卖返利小程序"是专为商家与用户双赢而设计的创新平台。以下是其开发方案的详细步骤：一、需求梳理：首先，我们需要明确小程序的核心功能和特色。包括设定活动类型、返利策略，以及用户体验友好的界面设计。二、技术决策：技术选型是关键。我们采用小程序的开发框架，利用JavaScript作为前端开发语言，并结合微信提供的API进行后端接口调用与数据处理。三、账
• 终于搞懂TS中的泛型啦! | typescript 入门指南 04 程序员王天 TypeScript实践指南前端javascripttypescript
  大家好，我是王天~今天分享的是《ts入门指南》系列中第四篇，主要讲解ts中的泛型应用泛型在ts中是比较重要的概念，我花挺长时间才搞明白，整理输出这篇文章，希望能帮助到大家~《ts入门指南》系列，点击下方蓝色字体即可访问TsvsJs谁适合前端开发？|TypeScript入门指南01详解tsconfig.json配置文件|TypeScript入门指南02必学！TypeScript语法类型基础|Type
• 前端HTML+CSS+JS的入门学习 俊昭喜喜里 前端htmlcss
  一.HTMLHTML（HyperTextMarkupLanguage）即超文本标记语言，是用于创建网页和网页应用程序的标准标记语言。它不是一种编程语言，而是一种标记语言，通过一系列的元素（elements）来告诉浏览器如何显示网页上的内容，如文本、图片、链接、表格、列表等。HTML文档由一系列的标签（tags）组成，这些标签告诉浏览器如何显示内容。标签通常成对出现，例如和，其中是开始标签，表示一个
• 10/24 每周学习总结5 木木ainiks 1024程序员节
  1RecordingtheMoolympicsS#include#includeusingnamespacestd;typedeflonglongint_1;intn;structnode{int_1begin_b;int_1end_e;}a[300];boolcmp(nodea,nodeb){if(a.end_e==b.end_e)returna.begin_b>b.begin_b;return
• 矩阵求逆（JAVA）利用伴随矩阵 qiuwanchi 利用伴随矩阵求逆矩阵
  package gaodai.matrix; import gaodai.determinant.DeterminantCalculation; import java.util.ArrayList; import java.util.List; import java.util.Scanner; /** * 矩阵求逆(利用伴随矩阵) * @author 邱万迟
• 单例（Singleton）模式 aoyouzi 单例模式Singleton
  3.1           概述 如果要保证系统里一个类最多只能存在一个实例时，我们就需要单例模式。这种情况在我们应用中经常碰到，例如缓存池，数据库连接池，线程池，一些应用服务实例等。在多线程环境中，为了保证实例的唯一性其实并不简单，这章将和读者一起探讨如何实现单例模式。 3.2
• [开源与自主研发]就算可以轻易获得外部技术支持,自己也必须研发 comsci 开源
        现在国内有大量的信息技术产品，都是通过盗版，免费下载，开源，附送等方式从国外的开发者那里获得的。。。。。。        虽然这种情况带来了国内信息产业的短暂繁荣，也促进了电子商务和互联网产业的快速发展，但是实际上，我们应该清醒的看到，这些产业的核心力量是被国外的
• 页面有两个frame,怎样点击一个的链接改变另一个的内容 Array_06 UIXHTML
  <a src="地址"  targets="这里写你要操作的Frame的名字" />搜索 然后你点击连接以后你的新页面就会显示在你设置的Frame名字的框那里 targerts="",就是你要填写目标的显示页面位置 ===================== 例如： <frame src=&
• Struts2实现单个/多个文件上传和下载 oloz 文件上传struts
  struts2单文件上传：     步骤01:jsp页面 <!--在进行文件上传时，表单提交方式一定要是post的方式，因为文件上传时二进制文件可能会很大，还有就是enctype属性，这个属性一定要写成multipart/form-data，不然就会以二进制文本上传到服务器端--> 　　<form action="fileUplo
• 推荐10个在线logo设计网站 362217990 logo
  在线设计Logo网站。 1、http://flickr.nosv.org（这个太简单） 2、http://www.logomaker.com/?source=1.5770.1 3、http://www.simwebsol.com/ImageTool 4、http://www.logogenerator.com/logo.php?nal=1&tpl_catlist[]=2 5、ht
• jsp上传文件 香水浓 jspfileupload
  1. jsp上传 Notice： 1. form表单 method 属性必须设置为 POST 方法 ，不能使用 GET 方法 2. form表单 enctype 属性需要设置为 multipart/form-data 3. form表单 action 属性需要设置为提交到后台处理文件上传的jsp文件地址或者servlet地址。例如 uploadFile.jsp 程序文件用来处理上传的文
• 我的架构经验系列文章 - 前端架构 agevs JavaScriptWeb框架UIjQuer
  框架层面：近几年前端发展很快，前端之所以叫前端因为前端是已经可以独立成为一种职业了，js也不再是十年前的玩具了，以前富客户端RIA的应用可能会用flash/flex或是silverlight，现在可以使用js来完成大部分的功能，因此js作为一门前端的支撑语言也不仅仅是进行的简单的编码，越来越多框架性的东西出现了。越来越多的开发模式转变为后端只是吐json的数据源，而前端做所有UI的事情。MVCMV
• android ksoap2 中把XML(DataSet) 当做参数传递 aijuans android
  我的android app中需要发送webservice ，于是我使用了 ksop2 进行发送，在测试过程中不是很顺利,不能正常工作.我的web service 请求格式如下     [html]  view plain copy   <Envelope xmlns="http://schemas.
• 使用Spring进行统一日志管理 + 统一异常管理 baalwolf spring
  统一日志和异常管理配置好后，SSH项目中，代码以往散落的log.info() 和 try..catch..finally 再也不见踪影！ 统一日志异常实现类： [java]  view plain copy   package com.pilelot.web.util;      impor
• Android SDK 国内镜像 BigBird2012 android sdk
  一、镜像地址： 1、东软信息学院的 Android SDK 镜像，比配置代理下载快多了。 配置地址， http://mirrors.neusoft.edu.cn/configurations.we#android 2、北京化工大学的： IPV4:ubuntu.buct.edu.cn  IPV4:ubuntu.buct.cn IPV6:ubuntu.buct6.edu.cn
• HTML无害化和Sanitize模块 bijian1013 JavaScriptAngularJSLinkySanitize
  一.ng-bind-html、ng-bind-html-unsafe         AngularJS非常注重安全方面的问题，它会尽一切可能把大多数攻击手段最小化。其中一个攻击手段是向你的web页面里注入不安全的HTML，然后利用它触发跨站攻击或者注入攻击。         考虑这样一个例子，假设我们有一个变量存
• [Maven学习笔记二]Maven命令 bit1129 maven
  mvn compile compile编译命令将src/main/java和src/main/resources中的代码和配置文件编译到target/classes中，不会对src/test/java中的测试类进行编译 MVN编译使用 maven-resources-plugin:2.6:resources maven-compiler-plugin:2.5.1:compile &nbs
• 【Java命令二】jhat bit1129 Java命令
  jhat用于分析使用jmap dump的文件，，可以将堆中的对象以html的形式显示出来，包括对象的数量，大小等等，并支持对象查询语言。 jhat默认开启监听端口7000的HTTP服务，jhat是Java Heap Analysis Tool的缩写 1. 用法： [hadoop@hadoop bin]$ jhat -help Usage: jhat [-stack <bool&g
• JBoss 5.1.0 GA:Error installing to Instantiated: name=AttachmentStore state=Desc ronin47
  进到类似目录 server/default/conf/bootstrap，打开文件 profile.xml找到： Xml代码<bean    name="AttachmentStore"  class="org.jboss.system.server.profileservice.repository.AbstractAtta
• 写给初学者的6条网页设计安全配色指南 brotherlamp UIui自学ui视频ui教程ui资料
  网页设计中最基本的原则之一是，不管你花多长时间创造一个华丽的设计，其最终的角色都是这场秀中真正的明星——内容的衬托     我仍然清楚地记得我最早的一次美术课，那时我还是一个小小的、对凡事都充满渴望的孩子，我摆放出一大堆漂亮的彩色颜料。我仍然记得当我第一次看到原色与另一种颜色混合变成第二种颜色时的那种兴奋，并且我想，既然两种颜色能创造出一种全新的美丽色彩，那所有颜色
• 有一个数组，每次从中间随机取一个，然后放回去，当所有的元素都被取过，返回总共的取的次数。写一个函数实现。复杂度是什么。 bylijinnan java算法面试
  import java.util.Random; import java.util.Set; import java.util.TreeSet; /** * http://weibo.com/1915548291/z7HtOF4sx * #面试题#有一个数组，每次从中间随机取一个，然后放回去，当所有的元素都被取过，返回总共的取的次数。 * 写一个函数实现。复杂度是什么
• struts2获得request、session、application方式 chiangfai application
  1、与Servlet API解耦的访问方式。 a.Struts2对HttpServletRequest、HttpSession、ServletContext进行了封装，构造了三个Map对象来替代这三种对象要获取这三个Map对象，使用ActionContext类。 ----->   package pro.action; import java.util.Map; imp
• 改变python的默认语言设置 chenchao051 python
  import sys sys.getdefaultencoding()  可以测试出默认语言，要改变的话，需要在python lib的site-packages文件夹下新建： sitecustomize.py， 这个文件比较特殊，会在python启动时来加载，所以就可以在里面写上： import sys sys.setdefaultencoding('utf-8') &n
• mysql导入数据load data infile用法 daizj mysql导入数据
  我们常常导入数据！mysql有一个高效导入方法，那就是load data infile 下面来看案例说明 基本语法： load data  [low_priority] [local] infile 'file_name txt' [replace | ignore] into table tbl_name [fields [terminated by't'] [OPTI
• phpexcel导入excel表到数据库简单入门示例 dcj3sjt126com PHPExcel
  跟导出相对应的，同一个数据表，也是将phpexcel类放在class目录下，将Excel表格中的内容读取出来放到数据库中 <?php error_reporting(E_ALL); set_time_limit(0); ?> <html> <head> <meta http-equiv="Content-Type"
• 22岁到72岁的男人对女人的要求 dcj3sjt126com
  22岁男人对女人的要求是：一，美丽，二，性感，三，有份具品味的职业，四，极有耐性，善解人意，五，该聪明的时候聪明，六，作小鸟依人状时尽量自然，七，怎样穿都好看，八，懂得适当地撒娇，九，虽作惊喜反应，但看起来自然，十，上了床就是个无条件荡妇。 32岁的男人对女人的要求，略作修定，是：一，入得厨房，进得睡房，二，不必服侍皇太后，三，不介意浪漫蜡烛配盒饭，四，听多过说，五，不再傻笑，六，懂得独
• Spring和HIbernate对DDM设计的支持 e200702084 DAO设计模式springHibernate领域模型
  A：数据访问对象     DAO和资源库在领域驱动设计中都很重要。DAO是关系型数据库和应用之间的契约。它封装了Web应用中的数据库CRUD操作细节。另一方面，资源库是一个独立的抽象，它与DAO进行交互，并提供到领域模型的“业务接口”。    资源库使用领域的通用语言，处理所有必要的DAO，并使用领域理解的语言提供对领域模型的数据访问服务。
• NoSql 数据库的特性比较 geeksun NoSQL
  Redis 是一个开源的使用ANSI C语言编写、支持网络、可基于内存亦可持久化的日志型、Key-Value数据库，并提供多种语言的API。目前由VMware主持开发工作。   1. 数据模型 作为Key-value型数据库，Redis也提供了键（Key）和值（Value）的映射关系。除了常规的数值或字符串，Redis的键值还可以是以下形式之一： Lists （列表） Sets
• 使用 Nginx Upload Module 实现上传文件功能 hongtoushizi nginx
  转载自： http://www.tuicool.com/wx/aUrAzm   普通网站在实现文件上传功能的时候，一般是使用Python，Java等后端程序实现，比较麻烦。Nginx有一个Upload模块，可以非常简单的实现文件上传功能。此模块的原理是先把用户上传的文件保存到临时文件，然后在交由后台页面处理，并且把文件的原名，上传后的名称，文件类型，文件大小set到页面。下
• spring-boot-web-ui及thymeleaf基本使用 jishiweili springthymeleaf
  视图控制层代码demo如下：   @Controller @RequestMapping("/") public class MessageController { private final MessageRepository messageRepository; @Autowired public MessageController(Mes
• 数据源架构模式之活动记录 home198979 PHP架构活动记录数据映射
  hello!架构 一、概念 活动记录（Active Record）：一个对象，它包装数据库表或视图中某一行，封装数据库访问，并在这些数据上增加了领域逻辑。 对象既有数据又有行为。活动记录使用直截了当的方法，把数据访问逻辑置于领域对象中。   二、实现简单活动记录 活动记录在php许多框架中都有应用，如cakephp。 <?php /** * 行数据入口类 *
• Linux Shell脚本之自动修改IP pda158 linuxcentosDebian脚本
  作为一名 Linux SA，日常运维中很多地方都会用到脚本，而服务器的ip一般采用静态ip或者MAC绑定，当然后者比较操作起来相对繁琐，而前者我们可以设置主机名、ip信息、网关等配置。修改成特定的主机名在维护和管理方面也比较方便。如下脚本用途为：修改ip和主机名等相关信息，可以根据实际需求修改，举一反三！ #!/bin/sh #auto Change ip netmask ga
• 开发环境搭建 独浮云 eclipsejdktomcat
         最近在开发过程中，经常出现MyEclipse内存溢出等错误，需要重启的情况，好麻烦。对于一般的JAVA+TOMCAT项目开发，其实没有必要使用重量级的MyEclipse，使用eclipse就足够了。尤其是开发机器硬件配置一般的人。         &n
• 操作日期和时间的工具类 vipbooks 工具类
     大家好啊，好久没有来这里发文章了，今天来逛逛，分享一篇刚写不久的操作日期和时间的工具类，希望对大家有所帮助。 /* * @(#)DataFormatUtils.java 2010-10-10 * * Copyright 2010 BianJing,All rights reserved. */ package test; impor

按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他

首页 - 关于我们 - 站内搜索 - Sitemap - 侵权投诉

版权所有 IT知识库 CopyRight © 2000-2050 E-COM-NET.COM , All Rights Reserved.