css框架

面试题目整理

安稳与你 提交于 2020-03-13 18:45:43
HTML&CSS 1、常用哪几种浏览器测试?有哪些内核(Layout Engine)? (Q1)浏览器:IE,Chrome,Firefox,Safari,Opera (Q2)内核:Trident,Gecko,Presto,Webkit 2、说下行内元素和块级元素的区别?行内块元素的兼容性使用?(IE8以下) (Q1)行内元素:会在水平方向排列,不能包含块级元素,设置width无效,height无效(可以设置line-height),margin上下无效 padding上下无效。块级元素:各占据一行,垂直方向排列。从新行开始结束接着一个断行 (Q2)兼容性:display:inline-block;*display:inline;*zoom:1; 3、清除浮动有哪些方式?比较好的方式是哪一种 (Q1)(1)父级div定义height (2)结尾处加空div标签clear:both (3)父级div定义伪类:after和zoom (4)父级div定义overflow:hidden (5)父级div定义overflow:auto (6)父级div也浮动,需要定义宽度 (7)父级div定义display:table (8)结尾处加br标签clear:both (Q2)比较好的是第3种方式,好多网站都这么用 1、box-sizing 常用的属性有哪些?分别有什么作用? (Q1)box

前端面试题四

家住魔仙堡 提交于 2020-03-13 00:24:22
面试有几点需注意: 面试题目: 根据你的等级和职位的变化,入门级到专家级,广度和深度都会有所增加。 题目类型: 理论知识、算法、项目细节、技术视野、开放性题、工作案例。 细节追问: 可以确保问到你开始不懂或面试官开始不懂为止,这样可以大大延展题目的区分度和深度,知道你的实际能力。因为这种知识关联是长时期的学习,临时抱佛脚绝对是记不住的。 回答问题再棒,面试官(可能是你面试职位的直接领导),会考虑我要不要这个人做我的同事?所以态度很重要、除了能做事,还要会做人。(感觉更像是相亲( •̣̣̣̣̣̥́௰•̣̣̣̣̣̥̀ )) 资深的前端开发能把absolute和relative弄混,这样的人不要也罢,因为团队需要的是:你这个人具有可以依靠的才能(靠谱)。 前端开发知识点: HTML&CSS: 对Web标准的理解、浏览器内核差异、兼容性、hack CSS基本功:布局、盒子模型、选择器优先级 HTML5、CSS3、Flexbox JavaScript: 数据类型、运算、对象、Function、继承、闭包、作用域、原型链、事件、RegExp、JSON、Ajax、 DOM、BOM、内存泄漏、跨域、异步装载、模板引擎、前端MVC、路由、模块化、Canvas、ECMAScript 6、Nodejs 其他: 移动端、响应式、自动化构建、HTTP、离线存储、 WEB安全、优化、重构 团队协作、可维护

关于前端学习路线的一些建议

元气小坏坏 提交于 2020-03-12 11:52:21
前言 对于刚开始学习前端的伙伴俩说,问得最多的问题就是 ——前端技术现在如此繁杂,我到底应该如何学习。这个话题太大了,几句话回答不好;也由于这个问题确实困扰了很多前端开发人员,所以我也就着手系统的输出这篇文章。 虽然这篇文章花了很长时间,肯定也有其局限性;希望各位不吝指出。 入题 我们俨然能感受到前端岗位现在已经发展成了最重要的研发岗位之一,所以对我们提出的要求也就越来越高。所以我们需要学的也就不仅仅只是CSS&HTML&JavaScript了。但这三大件一直都是前端的根本,这一点从未改变。而这三大件中JavaScript又是重中之重。 接下来我会结合我的一点经验,给出前端学习路线的一些具体建议。 目录 三大件学习 库工具 前端框架( MVVM )的学习 浏览器 & 计算机基础 前端工程化 性能优化 Nodejs 数据结构和算法 依葫芦画瓢 三大件学习 现在每年依旧有很多初级入门的前端开发。所以对初入门的朋友也给出一点意见。 刚入门的朋友,我觉得不应该一开始就学习像Vue、TypeScript、Webpack等知识。应该把重点放在CSS&HTML&JavaScript基础知识的学习上。 CSS & HTML 对于刚入门的朋友我依旧建议先将CSS(3)&HTML(5)的知识点认真学习一遍。学习的途中最好是学习完一部分就自己在敲一遍代码,加深自己的记忆。 当然如果你愿意

JQuery日期插件datepicker的使用

丶灬走出姿态 提交于 2020-03-12 07:34:30
1. jQuery 是一款非常优秀的脚本框架,其丰富的控件使用起来也非常简单,配置非常灵活。下面做一个使用日期插件datapicker的例子。 1、下载jQuery核心文件就不用说了吧,datepicker是轻量级插件,只需jQuery的min版本就行了,然后到官网 http://jqueryui.com/download 下载jquery-ui压缩包(可以选择喜欢的theme),里面就包含对datepicker的支持,当然您也可以网站 http://marcgrabanski.com/pages/code/jquery-ui-datepicker 下载datepicker,包括ui.core.js和ui.datepicker.js。 2、在HTML中引用下载下来的js文件: [xhtml] view plain copy <!-- 引入 jQuery --> < mce:script src= "js/jquery.1.4.2.js" mce_src= "js/jquery-1.5.1.min.js" type= "text/ JavaScript " > </ mce:script > <!--添加datepicker支持--> < mce:script src= "js/jquery.ui.core.js" mce_src= "js/jquery.ui.core.js"

迷你MVVM框架 avalonjs 学习教程10、样式操作

馋奶兔 提交于 2020-03-11 06:20:50
一般情况下我们通过设置类名就可以改变元素的样式,但涉及到动画部分,就一定需要设置内联样式了,因此有了 ms-css 。* ms-css *的用法为 ms-css-样式名="样式值" , 如ms-css-width=”prop”(会自动补px),ms-css-height=”{{prop}}%”, ms-css-color=”prop”, ms-css-background-color=”prop”, ms-css-font-size=”{{prop}}px”。细细联想,ms-css与ms-class的旧风格、ms-data、ms-attr的用法相仿,属性名接第三个参数作为name,属性值作为value。 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> <script src="avalon.js"></script> <script> var model = avalon.define({ $id: "test", background: "red" }) model.$watch("background", function(v) { model.background = v }) </script> </head> <body>

[原]《Web前端开发修炼之道》-读书笔记CSS部分

拥有回忆 提交于 2020-03-10 05:31:46
如何组织CSS-分层 应用 css 的能力分两部分:一部分是css的API,重点是如何用css控制页面内元素的样式;另一部分是css框架,重点是如何对 css 进行组织。如何组织 css 可以有多种角度,例如按功能划分,或者按区块划分。这里讲一下 base.css + common.css + page.css 的组织方法。将网站内的所有样式,按照职能分成三大类:base、common、page,这三者是层叠结构。 1、base 层-精简通用 位于三者的最底层,提供 css reset 功能和粒度最小的通用类——原子类。这一层会被所有页面引用,是页面样式所需依赖的最底层,不同风格的网站可以使用同一个 base 层,所以,应具有高度可移植性,力求精简和通用。该层相对稳定,基本不需要维护,可以简单地放在一个文件里,如 base.css。 css reset 即一开始就将浏览器的默认样式全部去掉,就是通过重新定义标签的样式,“覆盖”掉浏览器提供的默认样式。可以将常用的标签显式地罗列出来,避免使用“*”,如来自于 YUI 的部分 css reset 的代码: /*CSS reset*/ body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{margin

vue-cli中的webpack配置

被刻印的时光 ゝ 提交于 2020-03-08 03:10:55
  安装好vue-cli之后,我们可以在package.json中看到下面所示: { // 项目名称 "name": "myvue", // 项目版本 "version": "1.0.0",   // 项目描述 "description": "A Vue.js project", // 项目作者 "author": "", // 是否私人 "private": true, // 快速运行脚本 "scripts": {  // 这是我们在本地调试时最常用的,即运行项目,创建了本地服务器在localhost:8088打开,运行的就是build下的server.js "dev": "node build/dev-server.js",  // 同样的,因为很多人习惯 npn start 来启动一个项目,这里也是可以的。 "start": "node build/dev-server.js",  // 即部署到服务器上我们需要使用这样的方式,运行build下的build.js "build": "node build/build.js" }, // 注意和devDependencies的区别,根据这里的依赖项,最终在build文件时,会将其中的依赖文件一起进行打包。 "dependencies": { "vue": "^2.2.6", "vue-router": "^2.3.1" }, /

如何仿建网站?附带个人博客样式搭建实例

爱⌒轻易说出口 提交于 2020-03-07 13:59:16
本文及技术仅供学习,请勿用于其他用途 更新记录 【1】2020.03.06-16:51 1.完善内容 正文 前言 本教程的博客园样式实例不公布完整css代码,白嫖党请走开,氪金大佬另谈 本教程为初级篇,未涉及JavaScript 我们每天都会在在博客园写博客,看博客,时间久了,未免对这千篇一律的博客皮肤感到烦躁 那能不能想办法更改呢 答案是可以的 有的人可能会问,我自己又没有什么编程基础(那你来博客园干啥awa),更何况不会css,该怎么办呢? 肯定是学习 + 看教程喽 本文就是一篇附带实例的教程 那么,你要做的就是学习 根据个人实际经历来看,我建议你 8天学习HTML(个人实际5天) 8天学习css(个人实际10天) 10天学习JavaScript(个人实际10天) (本人有一定的编程基础) 然后就能达到随心所欲的修改博客园皮肤的水平了 想达到专业水平还是老老实实的学上半年再说吧 好了,回归正题 仿建网站的前提是千万不要侵权,即使是做个皮肤自己欣赏欣赏,也要记得加上原网站的链接 首先你要选择一个你认为满意的网站 然后学习它的源代码 然后自己在博客园码一些css的东西 就这么简单 下面还是让我们边看实例边说话 实例时间 先放张图片感受一下 图1 原网站 图2 个人博客园皮肤 没错,是高仿 首先先让我们来看一下原来的样子 图3 无css 没错,非常磕碜(不磕碜我就不改了awa)

web前端01

守給你的承諾、 提交于 2020-03-06 17:48:38
l W3C标准:结构(HTML描绘页面骨架),样式表现(CSS),行为(JS) l Html(超链接标记文本),纯文本只能保存文本内容,音频视频都不能。 l 纯文本作为网页后缀html l 标签:用标签标记一级标题等。 <标签名(如:h1)> 标签有开始也有结束, <h1>this my firt web</h1>. l 根标签<\html>(一个页面只有一个根标签),所有内容均写到根标签里面 l 有两个子标签, <html><head></head><body></body></html> ,head body 兄弟标签 l 标准结构 <!doctype html> <html> <head> <meta character="utf-8" /> <title></title>(显示在网页的标题栏) </head> <body> <!--在这个结构中编写注释--> <h1>这是我的<font color="red"></h1> <h2> </h2> <h3> </h3> <p>楚河<br /> 汉界<br /> </p> </body> </html> l Head标签内容不显示在用户端,设置信息让浏览器看从而帮助浏览器解析 l Body显示用户页面中所有可见内容 l 不希望别人动可以写注释 l 超链接里的字就是tittle l <font></font> 设置字体

[Sass]Sass基础知识面试题

∥☆過路亽.° 提交于 2020-03-05 23:58:03
1、有多少种方法可以使用SASS? 您可以使用三种不同的方式使用SASS: 作为命令行工具 作为一个Ruby模块 作为Rack启用框架的插件 2、SASS中的嵌套规则是什么? 嵌套是不同逻辑结构的组合。 使用SASS,我们可以将多个CSS规则相互组合。 如果使用多个选择器,则可以在另一个选择器中使用一个选择器来创建复合选择器。 3、如何在SASS中引用父选择器? 使用&字符选择父级选择器。 它告诉父选择器应该插入的位置。 4、如何在SASS中写入占位符选择器? SASS使用 class 或 id 选择器支持占位符选择器。 在正常CSS中,这些用“#"或“。“指定,但在SASS中,它们替换为“%”。 5、列出SASS上的不同类型的运算符? 有5种类型的运算符: 数字运算符 颜色运算符 字符串运算符 布尔运算符 列表运算符 6、什么是数字运算? 它允许诸如加法,减法,乘法和除法的数学运算。 7、什么是彩色运算? 它允许使用颜色分量和算术运算。 8、什么是列表运算? 列表表示使用逗号或空格分隔的一系列值。 9、什么是布尔运算? 您可以使用and、or和not(与或非)对Sass脚本执行布尔运算。 10、SASS中的括号是什么? 括号是一对标记,通常用圆括号()或方括号[]来标记,这提供了影响操作顺序的符号逻辑。 11、什么是SASS中的插值? 它使用#{}