css框架

html+css

狂风中的少年 提交于 2020-01-30 13:18:43
明白了,前端就是这三个东西啊 前端三剑客:HTML,css,js jquery,vue都是js 响应式是,媒体查询,弹性布局,网格布局都是:css https://www.jianshu.com/p/1279ad376a2f 需要用的时候再看吧,现在先把element-ui框架弄好 极客学院 把H5C3特性看一遍吧 所谓的HTML5只是,HTML的第五个版本而已 HTML5原本为万维网的核心语言、标准通用标记语言下的一个应用超文本标记语言(HTML)的第五次重大修改,简称H5 如今的HTML5= HTML + CSS + JavaScript + API 来源: https://www.cnblogs.com/Py-king/p/12242441.html

html介绍和head标签

人盡茶涼 提交于 2020-01-29 19:56:48
一、web标准 web准备介绍: w3c:万维网联盟组织,用来制定web标准的机构(组织) web标准:制作网页遵循的规范 web准备规范的分类:结构标准、表现标准、行为标准。 结构:html。表示:css。行为:Javascript。 web准备总结: 结构标准:相当于人的身体。html就是用来制作网页的。 表现标准: 相当于人的衣服。css就是对网页进行美化的。 行为标准: 相当于人的动作。JS就是让网页动起来,具有生命力的 二、浏览器介绍 浏览器是网页运行的平台,常用的浏览器有IE、火狐(Firefox)、谷歌(Chrome)、猎豹浏览器、Safari和Opera等 浏览器内核: 浏览器  内核 IE trident chrome blink 火狐 gecko Safari webkit PS:「浏览器内核」也就是浏览器所采用的「渲染引擎」,渲染引擎决定了浏览器如何显示网页的内容以及页面的格式信息。 渲染引擎是兼容性问题出现的根本原因。 三、开发工具介绍 Sublime Text的使用 参考链接: Sublime Text使用技巧 四、HTML介绍 1、HTML的概述 html全称HyperText Mackeup Language,翻译为超文本标记语言,它不是一种编程语言,是一种描述性的标记语言,用于描述超文本内容的显示方式。比如字体、颜色、大小等。 超文本:音频,视频

项目实战

感情迁移 提交于 2020-01-29 07:06:39
项目实战 1.环境介绍 2.nvm和node.js环境配置 3.npm使用详解 4.gulp介绍和安装 5.gulp创建任务 6.gulp创建处理css文件任务 7.gulp给文件重命名 8.gulp处理JavaScript文件的任务 9.合并多个文件 10.创建压缩图片任务 11.监听文件修改,自动执行任务 12.修改代码实时刷新浏览器 13.项目环境搭建和安装相应包 14.编写gulpfile.js文件 15.sass语法介绍和转换为css 16.导航条实现(1) 17.导航条实现(2) 18.导航条实现(3) 19.导航条吸顶效果 20.轮播图布局和样式 21.JS面向对象和实现一次轮播 22.实现自动轮播 23.鼠标hover事件控制轮播图暂停和继续 24.切换轮播图的箭头样式及其显示和隐藏事件 25.轮播图上下切换 26.小圆点结构和样式 27.根据轮播图的个数动态修改小圆点结构和样式 28.小圆点点击事件和自动更新当前选中的小圆点 29.实现自动无限循环轮播 30.左右箭头切换实现循环轮播 31.新闻列表tab栏布局完成 32.新闻列表页布局完成 33.加载更多按钮的布局和样式 34.侧边栏-标题和广告位布局完成 35.侧边栏-关注第三方平台盒子布局和样式 36.侧边栏-热门推荐完成 37.footer布局和样式(1) 38.footer布局和样式(2) 39

前端高级学习路线-1项目

拥有回忆 提交于 2020-01-29 06:07:58
主要两个项目, 一个是侧重于css特效方面的,要求就是非常酷,帅到没朋友 第二个项目侧重逻辑处理,用来升华你的逻辑能力 这两个项目可以从网上搜几个网站来模仿,之前我的学生有做过:苹果官网,魅族官网,花瓣网,网易云音乐,在行等很多网站,做的也很不错。 我个人是想做: 一个有模有样的微信小程序(小程序) 一些常见的静态网页布局(DIV+CSS,H5) 一个略复杂的网站:微医网患者问诊数据交互(JS/ES6) 一个VUE框架下的网站:用上面的网站转换!( VUE) 来源: CSDN 作者: Yslsql 链接: https://blog.csdn.net/qq_26983201/article/details/103826975

前端性能优化方法总结及响应状态码详解

倾然丶 夕夏残阳落幕 提交于 2020-01-28 14:12:52
前端优化的途径有很多,按粒度大致可以分为两类, 第一类是页面级别的优化,例如 HTTP请求数、脚本的无阻塞加载、内联脚本的位置优化等 ; 第二类则是代码级别的优化,例如 Javascript中的DOM 操作优化、CSS选择符优化、图片优化以及 HTML结构优化等等。另外,本着提高投入产出比的目的,后文提到的各种优化策略大致按照投入产出比从大到小的顺序排列。 一、页面级优化   1. 减少 HTTP请求数   这条策略基本上所有前端人都知道,而且也是最重要最有效的。都说要减少 HTTP请求,那请求多了到底会怎么样呢 ?首先,每个请求都是有成本的,既包含时间成本也包含资源成本。一个完整的请求都需要经过 DNS寻址、与服务器建立连接、发送数据、等待服务器响应、接收数据这样一个 “漫长” 而复杂的过程。时间成本就是用户需要看到或者 “感受” 到这个资源是必须要等待这个过程结束的,资源上由于每个请求都需要携带数据,因此每个请求都需要占用带宽。另外,由于浏览器进行并发请求的请求数是有上限的 (具体参见此处 ),因此请求数多了以后,浏览器需要分批进行请求,因此会增加用户的等待时间,会给用户造成站点速度慢这样一个印象,即使可能用户能看到的第一屏的资源都已经请求完了,但是浏览器的进度条会一直存在。   2.合理设置 HTTP缓存   缓存的力量是强大的,恰当的缓存设置可以大大的减少 HTTP请求

CSS的总结

情到浓时终转凉″ 提交于 2020-01-27 04:19:39
1.如果利用<img>标签把图片放进表格单元里面,并注意到在图片下方有不需要的空间,那么设置它的display属性为block. 2.text-align可以被继承,vertical-align属性不会被继承 3.html提供<colgroup>和<col>标签相应地表示列组合和独立的列。 表格中的每个列都包括一个<col>标签,可以用类或ID来识别它们。只有两组属性对这些标签起作用:width和background属性。 <colgroup> <col id="brand"/> <col id="price"/> <col id="power"/> </colgroup> 4.IE6.0兼容支持透明背景 * html .tit2 .ms{ zoom:1; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, src="http://hszy00232.blog.163.com/blog/images/jia.png",sizingMethod="scale"); background:none;} 5.浏览器兼容处理半透明效果 dd{width:215px; height:20px;background:#000; filter:alpha(opacity=70); opacity:0.7

河南省周口市安吉软件测试培训中心第一次软件测试课程-网页前端基础

孤街醉人 提交于 2020-01-25 03:03:56
1.1Web基础知识 1.2Web相关的名词: 1、world wide web(万维网):我们可以理解为是基于http协议和超文本传输语言的信息交换系统。 2、网站:我们可以将网站理解为是在上述的信息交换系统内用来临时存放和交流信息的一个平台(该平台就是由网页组成) 3、http协议:我们可以认为是用来规定不同的网站之间或者不同的客户端与服务器之间如何进行数据交换的一种规则。 4、超文本传输语言:不仅仅只能传文字的语言,超越文本(图片、声音、视频),我们称之为HTML 5、url:我们可以将url理解为是在输入在浏览器地址栏中的那串字符。http://www.hao123.com:80(通过url打开的是网页,而网页就是用html来编写的) 6、网页的本质就是一个html格式的文件(网页是用html来编写的,用户看到的是界面,开发看到的是源码) 1.3HTML基本介绍 一、定义 HTML就是HyperText Markup Language,在国内我们称之为叫超文件标记语言。 二、HTML发展过程 1、html1.0--->html5.0 2、W3C这个组织专门来制定HTML语言的标准 3、浏览器生产厂商他们生产的浏览器,前端编写的是HTML代码,而用户看到的是最终的网页,所以浏览器的任务就是将HTML代码“渲染”成用户可以看到的图形界面。 三、HTML的作用

web前端入门科普集

一世执手 提交于 2020-01-25 02:04:10
每一个写前端的人都有不同的故事.但是都是基础从零开始.实习公司用的框架也好,网上查到的例子也好,都是需要基础才可以看懂的.那基础是什么呢,我觉得就是常用的前端的一切.我刚写前端三个月.整理一下自己学到的知识. 1:什么是html? HTML是World Wide Web上统一的语言。指的是超文本标记语言 (Hyper Text Markup Language),使用它所提供的标签,人类已经创建了令人惊奇、姿态万千的超链接的文档网络。这里要注意的是:HTML不是一种编程语言,而是一种标记语言 (markup language)。 它的基本语法是以"<>“尖括号标签开始,以”"尖括号中带刚斜杠的标签结束,标签通常是成对出现的,标签对中的第一个标签是开始标签,第二个标签是结束标签,或者称为开放标签和闭合标签. 使用到的场景: 比如说你需要写一个页面.那你可以这样写: <html> <body> <h1>我是你的第一个页面!</h1> <p>hello world!</p> </body> </html> 专门建立的学习Q-q-u-n: 731771211,分享学习方法和需要注意的小细节,不停更新最新的教程和学习技巧 (从零基础开始到前端项目实战教程,学习工具,全栈开发学习路线以及规划) 效果图: 2:什么是css样式? CSS是一种向网页添加样式的机制,样式表可描述文档如何被显示

Web 前端开发精华文章集锦(jQuery、HTML5、CSS3)【系列十七】

a 夏天 提交于 2020-01-25 01:13:11
原文地址:http://www.cnblogs.com/lhb25/p/must-read-links-for-web-designers-and-developers-volume-17.html   《Web 前端开发精华文章推荐》2013年第五期(总第十七期)和大家见面了。梦想天空博客关注 前端开发 技术,分享各种增强网站用户体验的 jQuery 插件,展示前沿的 HTML5 和 CSS3 技术应用,推荐优秀的 网页设计 案例,共享精美的设计素材和优秀的 Web 开发工具,希望这些精心整理的前端技术文章能够帮助到您。 JavaScript 【干货分享】32本优秀的 JavaScript 免费电子书 Verlet-js:超炫的开源 JavaScript 物理引擎 优秀教程:创建基于 Ajax 的文件拖放上传功能 Two.js – 为现代浏览器而生的 2D 绘图 API Squel.js – 基于 JavaScript 的 SQL 查询构建器 PathFinding.js – 综合性的 JavaScript 路径查找库 FlipClock.js 制作精美的时钟、定时器和倒计时功能 jQuery Web 开发最有用的50款 jQuery 插件《图片特效篇》 jQuery.mmenu – 用于移动 Web 项目的光滑菜单 jQuery 插件:用于移动项目的响应式音频播放器

CSS浏览器兼容性问题及处理方法

夙愿已清 提交于 2020-01-24 22:06:02
浏览器差异 1、ul和ol列表缩进问题消除ul、ol等列表的缩进时,样式应写成:list-style:none;margin:0px;padding:0px; 其中margin属性对IE有效,padding属性对FireFox有效。 [注]经验证,在IE中,设置margin:0px可以去除列表的上下左右缩进、空白以及列表编号或圆点,设置padding对样式没有影响;在 Firefox 中,设置margin:0px仅仅可以去除上下的空白,设置padding:0px后仅仅可以去掉左右缩进,还必须设置list- style:none才 能去除列表编号或圆点。也就是说,在IE中仅仅设置margin:0px即可达到最终效果,而在Firefox中必须同时设置margin:0px、 padding:0px以及list-style:none三项才能达到最终效果。 当li使用了float:left属性,记得使用clear:both来处理典型的错位问题 2、CSS透明问题IE:filter:progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=60)FF:opacity:0.6。 [注] 最好两个都写,并将opacity属性放在下面。 3、CSS圆角问题IE:ie7以下版本不支持圆角。 FF: -moz-border-radius:4px,或者