web前端：web前端-基础篇

作者:炸服的土豆 更新于： 2020-03-25 22:21:14

　　HTML、CSS、Javascript这三个是前端开发中最基本也是最必须的三个技能。前端的开发中，在页面的布局时，HTML将元素进行定义，CSS对展示的元素进行定位，再通过JavaScript实现相应的效果和交互。

　　该篇仅是本人学习前端时，做的备忘笔记：

　　一、背景图片设置：

　　设置背景图时的css代码：background-image:url(图片的url路径);

　　ps：设置好这个背景后请一定要设置该背景图片的大小和该背景图片的显示区域，css样式设置如下：

　　e.g.background-image:url(图片的url路径);

　　width:18px;height:18px;

　　不设置的话，出现的情况就是只有该内容区域有内容时，才会出现背景图片；ps：因为要让一个区域的背景图片显示的话，那前提肯定是得先让背景图片所在的块级区域有宽度和高度(高度必须要有，宽度没有则默认宽度为整个浏览器的宽度)才行啊，

　　背景图片的平铺css样式：background-repeat:repeat/no-repeat/repeat-x/repeat-y;

　　背景图片的定位:background-position:

　　取值1.xy以px为单位的数字，定义x轴和y轴的位置

　　2.x%y%

　　3.x或者x%,不写y，默认y为50%

　　4.关键字x：left/center/righty:top/center/bottom

　　背景图片的固定

　　background-attachment:

　　取值：1.scroll默认值，背景图定位以容器为准

　　背景图会随着页面滚动条滚动而变化

　　2.fixed固定，背景图定位以body为准

　　页面的滚动条，滚动，背景图不会随着发生位置变化

　　但是，只能在本容器区域内显示

　　前端即网站前台部分，运行在PC端，移动端等浏览器上展现给用户浏览的网页。随着互联网技术的发展，HTML5，CSS3，前端框架的应用，跨平台响应式网页设计能够适应各种屏幕分辨率，完美的动效设计，给用户带来极高的用户体验。