web页面在线设计怎么做-如何用WEB进行编写简单的在线考试系统？
2023-11-10 12:48:37 | 我爱编程网
本文目录一览：
web前端笔试题(HTML/CSS篇)
web前端笔试题集锦(HTML/CSS篇)
导读：网页不再只是承载单一的文字和图片，各种富媒体让网页的内容更加生动，网页上软件化的交互形式为用户提供了更好的使用体验，这些都是基于前端技术实现的。以下是由我J.L为您整理推荐的前端开发笔试题目，欢迎参考阅读。
一、HTML/CSS
1，让一个input的背景颜色变成红色
2，div的高宽等于浏览器可见区域的高宽，浏览器滚动，div始终覆盖浏览器的整个可见区域
思路：
(1)先放置一个div1，浮动：position:absolute;top:0px;left:0px;
(2)再放置一个div2，浮动：position:absolute;top:0px;left:0px;width:100%;height:100%;
(3)在div2中放置一个div3，令其高度超过浏览器高度，使div2产生滚动条
(4)对html,body进行样式设置：width:100%;height:100%;overflow:hidden->不让浏览器产生滚动条，避免页面出现两个滚动条
(5)编写JavaScript，另div2的高度等于页面可见高度，宽度等于页面可见宽度，注意，在计算完可见高度height和可见宽度width后，要对这两个值做处理，可见宽度-div2的滚动条的宽度，滚动条的宽度我这里假设是20px
这样题目基本就完成了，不过浏览器的兼容性还不是很好。
3，IE、FF下面CSS的解释区别
(1) 让页面元素居中
ff{margin-left:0px;margin-right:0px;width:***}
ie上面的设置+text-align:center
(2) ff：不支持滤镜
ie：支持滤镜
(3) ff：支持!important
ie支持*，ie6支持_
(4) min-width,min-height
FF支持，IE不支持，IE可以用css expression来替代
(5) Css Expression
FF不支持，IE支持
(6) cursor：hand
IE下可以显示手指状，FF下不行
(7) UL的默认padding和margin
IE下ul默认有margin，FF下ul默认有padding
(8) FORM的默认margin
IE下FORM有默认margin，FF下margin默认为0
4，一个定宽元素在浏览器(IE6，IE7，Firefox)中横向居中对齐的布局，请写出主要的.HTML标签及CSS
思路：
IE6/7：text-align:center
Firefox：margin:0 auto(margin-top和margin-bottom也可以为其他数字，关键是margin-left,margin-right为auto)
5，CSS中margin和padding的区别
margin是元素的外边框，是元素边框和相邻元素的距离
Padding是元素的内边框，是元素边框和子元素的距离
6，最后一个问题是，如何制作一个combo选项，就是可以输入可以下拉菜单选择。
思路：
(1)布局select和input，让input覆盖select，除了select的下拉图标，以方便select选择
(2)编写JS，为select添加onchange事件，onchange时将input的value置成select选中的指
7，
中alt和tittle的区别
alt：图片显示不出来了就提示alt
title：鼠标划过图片显示的提示
8，用css、html编写一个两列布局的网页，要求右侧宽度为200px，左侧自动扩展。
在这里我使用了两种方式：
(1)使用position
HTML:
left
right
(2) 使用float
HTML:
固定宽度
自适应
二者的CSS公用，如下：
html,body{width:100%;height:100%;margin:0px;padding:0px;}
.container {width:100%;height:400px;position:relative;}
.fl1 {float:left;}
.left {width:100%;height:400px;background:#AFFFD0;position:absolute;}
.right {width:200px;height:400px;background:#F9AFFF;position:absolute;right:0px;top:0px;}
.clear {clear:both;overflow:hidden;height:0px;}
.container2 {width:100%;height:400px;margin-top:100px;}
.left2 {background:#afffd0;height:400px;width:200px;margin-right:-3px;}
.right2 {height:400px;background:#f9afff;}
9，解释document.getElementByIdx_x_x_x("ElementID").style.fontSize="1.5em"
em是相对长度单位，相当于当前对象内文本的字体尺寸，如果当前行内文本的字体尺寸未被指定，则相对于浏览器的默认字体尺寸。
该语句将id为ElementID的元素的字体设置为当前对象内文本的字体尺寸的1.5倍
10，Doctype? 严格模式与混杂模式-如何触发这两种模式，区分它们有何意义? 行内元素有哪些?块级元素有哪些?CSS的盒模型?
DOCTYPE是文档类型，用来说明使用的HTML或者XHTML是什么版本，其中的DTD叫文档类型定义，里面包含了文档规则，浏览器根据定义的DTD来解析页面的标识并展现出来
DOCTYPE有两种用途：一个可以进行页面的有效性验证，另一个可以区分浏览器使用严格模式还是混杂模式来解析CSS。
严格模式和混杂模式是浏览器解析CSS的两种模式，目前使用的大部分浏览器对这两种模式都支持，但是IE5只支持混杂模式。
可那个过DOCTYPE声明来判断哪种模式被触发 我爱编程网
(1) 没有DOCTYPE声明的网页采用混杂模式解析
(2) 对使用DOCTYPE声明的网页视不同浏览器进行解析
(3) 对于浏览器不能识别的DOCTYPE声明，浏览器采用严格模式解析
(4) 在ie6下，如果在DOCTYPE声明之前有一个xml声明比如
，采用混杂模式解析，在IE7，IE8中这条规则不生效。
(5) 在ie下，如果DOCTYPE之前有任何字符，都会导致它进入混杂模式，如：
区分这两种模式可以理解浏览器解析CSS的区别，主要是在盒模式的解释上。
常见的块级元素有：DIV,FORM,TABLE,P,PRE,H1~H6,DL,OL,UL等
常见的内联元素：SPAN,A,STRONG,EM,LABEL,INPUT,SELECT,TEXTAREA,IMG,BR等
CSS盒模型用于描述为一个HTML元素形成的矩形盒子，盒模型还涉及元素的外边距，内边距，边框和内容，具体来讲最里面的内容是元素内容，直接包围元素内容的是内边距，包围内边距的是边框，包围边框的是外边距。内边距，外边距，边框默认为0。
11，CSS引入的方式有哪些? link和@import的区别?
引入css的方式有下面四种
(1) 使用style属性
(2) 使用style标签
(3) 使用link标签
(4) 使用@import引入
Link和@import区别：
(1) link属于XHTML标签，@import是CSS提供的一种方式。Link除了加载CSS外，还可以做很多事情，如定义RSS，rel连接属性等;@import只能加载CSS
(2)加载顺序不同，当页面被加载的时候，link加载的CSS随之加载，而@import引用的CSS会等到页面完全下载完之后才会加载
(3)兼容性差别，由于@import是CSS2.1提出的，所以老的浏览器不支持，IE系列的浏览器IE5以上才能识别，而link没有这个问题
使用DOM控制样式的差别，使用JavaScript控制DOM去改变样式的时候，只能操作link，@import不可以被DOM操作。
12，如何居中一个浮动元素?
一个浮动元素里面包含的元素可以水平居中，原理如下：
让浮动元素left相对于父元素container右移50%，浮动元素left的子元素left-child相对于left左移50%就可以实现left-child相对于container水平居中
垂直居中类似，不过操作的不是left而是top
13，HTML5和CSS3的了解情况
有所了解
HTML5和CSS3分别是新推出的HTML和CSS规范，前世是XHTML2和CSS2，目前还在草案阶段，不过得到了Apple，Opera，Mozilla，Google，Microsoft不同程度的支持，也开发出了不少基于他们的应用。
HTML5相对于原来的HTML规范有一些变化：
(1)DOCTYPE更简洁
(2)新增了一些语义化标签，如article,header,footer,dialog等
(3)新增了一些高级标签，如,,
CSS3相对于CSS2也新增了不少功能
(1) 选择器更加丰富
(2) 支持为元素设置阴影
(3) 无需图片能提供圆角
14，你怎么来实现下面这个设计图
(1) 切图
(2) 布局，采用两栏布局，分别左浮动
(3) 编写css代码
15，css 中id和class如何定义,哪个定义的优先级别高?
id：#***，***为HTML中定义的id属性
class:.***，***为HTML中定义的class属性
id比class的优先级高
16，用html实现如下表格(不如嵌套实用表格)
三行三列,其中第一行第一列和第二行第一列合并; 第二行第二列和第二行第三列合并(现场画表)
运行结果如下：
17，web标准网站有那些优点
(1) Web标准网站结构和布局分离，使网站的访问和维护更加容易
(2) Web标准网站结构，布局以及页面访问都标准化，使网站能在更多的web标准设备中访问，兼容性更好
(3) Web标准网站语义化更好，语义化的XHTML不仅对用户友好，对搜索引擎也友好。
;
web页面在线设计怎么做-如何用WEB进行编写简单的在线考试系统？
制作网页可以用什么软件？1、Coolsite360-新一代网页制作平台
可复制模板,更可任性DIY,无需编程,在线创建,自动适配桌面及移动端,新锐设计师优选,完全自由的样式设定,丰富的动画设定,一键部署。
2、AdobeDreamweaver
AdobeDreamweaver,简称“DW”,中文名称"梦想编织者",最初为美国MACROMEDIA公司开发,2005年被Adobe公司收购。DW是集网页制作和管理网站于一身的所见即所得网页代码编辑器。利用对?HTML、CSS、JavaScript等内容的支持,设计师和程序员可以在几乎任何地方快速制作和进行网站建设。
3、Flash
Flash是由macromedia公司推出的交互式矢量图和Web动画的标准,由Adobe公司收购。做Flash动画的人被称之为闪客。网页设计者使用Flash创作出既漂亮又可改变尺寸的导航界面以及其他奇特的效果。Flash的前身是FutureWave公司的FutureSplash,是世界上第一个商用的二维矢量动画软件,用于设计和编辑Flash文档。
4、Fireworks
由Macromedia(在2005年被Adobe收购)推出的一款网页作图软件,软件可以加速Web设计与开发,是一款创建与优化Web图像和快速构建网站与Web界面原型的理想工具。
Fireworks不仅具备编辑矢量图形与位图图像的灵活性,还提供了一个预先构建资源的公用库,并可与?AdobePhotoshop、AdobeIllustrator、AdobeDreamweaver和?AdobeFlash软件省时集成。
5、Frontpage
Frontpage,是微软公司出品的一款网页制作入门级软件。FrontPage使用方便简单,会用Word就能做网页,因此相对Dreamweaver等软件更容易上手。
特点:所见即所得,该软件结合了设计、程式码、预览三种模式。
如何用WEB进行编写简单的在线考试系统？想写一个基于B/S结构的在线考试学习系统?
简单的?
最简单的,没有验证,没有错题本,甚至没有用户登录,甚至没有题库,
直接一个html页面,页面上几道单选题,每道题一个inputhidden保存答案
然后JS控制提交
一个HTML页面就能做一个在线考试学系统系统,最简单
但如果想做的能够撑点场面的,用户模块要有,题库要有,错题本要有,单选多选填空简答题要支持,多人在线同步考试要支持,就困难了,没几个月花下去你是做不出来的
最好去找几个开源的“在线考试学习”系统,然后再在他人的基础上稍微改写代码,写个皮肤,就成你的啦,肯定能交作业。
制作网页可以用什么软件？制作网页可以用如下软件:
1、Coolsite360。特点有可复制模板,更可任性DIY,无需编程,在线创建,自动适配桌面及移动端。
2、AdobeDreamweaver。简称“DW”,中文名称"梦想编织者",最初为美国MACROMEDIA公司开发,2005年被Adobe公司收购。
3、Flash。是由macromedia公司推出的交互式矢量图和Web动画的标准,由Adobe公司收购。做Flash动画的人被称之为闪客。
4、Fireworks。是由Macromedia推出的一款网页作图软件,软件可以加速Web设计与开发,是一款创建与优化Web图像和快速构建网站与Web界面原型的理想工具。
5、Frontpage。Frontpage,是微软公司出品的一款网页制作入门级软件。FrontPage使用方便简单,会用Word就能做网页,因此相对Dreamweaver等软件更容易上手。
参考资料:
-网站制作软件
网页设计和前端开发到底有什么区别？都是做页面效果吗
网页设计和前端开发到底有什么区别？都是做页面效果吗
网页设计偏重于UI设计，差不多属于美工一类。就是做页面效果。
前端开发，是指前端功能开发，主要是实现前端功能，属于前端编码，
前端开发工程师独立出来主要就是做数据交互、后台处理、SEO优化等工作，要熟练各种脚本语言和运行环境，熟悉XML、SQL、ORACLE等数据库，熟悉AJXA、Jquery、Slivelight、Struct2、CSS4、Html5等网站处理技术。
网页设计（web design，又称为Web UI design，WUI design，WUI），是根据企业希望传递的信息（包括产品、服务、理念、文化），进行网站功能策划，然后进行的页面设计美化工作。作为企业对外宣传物料的其中一种，精美的网页设计，对于提升企业的互联网品牌形象至关重要。
网页设计一般分为三种大类：功能型网页设计（服务网站&B/S软件用户端）、形象型网页设计（品牌形象站）、信息型网页设计（门户站）。设计网页的目的不同，应选择不同的网页策划与设计方案。
网页设计的工作目标，是通过使用更合理的颜色、字体、图片、样式进行页面设计美化，在功能限定的情况下，尽可能给予用户完美的视觉体验。高级的网页设计甚至会考虑到通过声光、交互等来实现更好的视听感受。
网页设计主要以Adobe产品为主，常见的工具包括FW、PS、FL、DW、CDR、AI等，其中DW是代码工具，其他是图形图像和FL动画工具。还有最近几年Adobe新出的EdgeReflow、EdgeCode、Muse。
前者侧重程序实现，后者侧重视觉效果。
区别还是挺大的，网页设计偏重于UI设计，差不多属于美工一类。就是你说的做页面效果。
前端开发，是指前端功能开发，主要是实现前端功能，属于前端编码，工作内容很不一样。
网页设计和前端开发一样吗
不一样,不过现在前端开发你也不要东一些代码知识了，不然很难达到想要的效果和要求。
UI设计和前端开发有什么区别？哪个好？
- UI是平面的升级，大部分UI做的还是平面的工作，UI要有平面的基本功，懂编程，PHP比较适合，简单易学，而且现在很多web界面都是用PHP写的，大部分情况下UI是偏向设计的；
-
前端是什么，你可以查一查，我没做过前端，认识的几个做前端的在小公司就是打杂，基本啥都干，大公司的肯定要正规很多的；
没有好不好之分，都是比较辛苦的工作，什么时候你熬成大神了，这两个工作，哪个都不得了。
前端开发有什么插件可以实时看到页面效果
在IDE中进入“文件（File）→设置（Settings）→插件（Plugins）”中查找LiveEdit。如果你用的IDE版本没有内置这一插件，可以点击，会自动加载插件列表，这个过程可能会等待一段时间，请保持耐心。然后找到插件，点击下载即可。随后根据提示重启IDE。
网页UI设计和前端开发,到底该选择哪个?
UI设计是对手机客户端进行设计（其实网页设计也能叫UI设计），目前移动应用还是比较火的，所以这方面前景还是不错。
网页设计师是对网页进行设计，其实同UI设计差不多，主要是网页设计。
web前端广义上也包括设计，但是更主要的还是对前端页面的编程，比如HTML/JS/CSS等之类的。
我认为web前端更有前景，因为偏技术嘛。当日你的设计很牛逼那也未尝不是好的方向。
重点看你兴趣吧，
UI是设计，开发其实也包括设计吧，
但是都得懂代码才行，
希望能帮到 你（前端屋）
网页平面设计和前端web开发有区别吗
前端和设计师，
如果要区分的话，区别蛮大的。
前端是实现设计师出的图效果，做成页面，加上效果，各种JS，各种CSS等等。
设计师，按正规来说，和程序员沟通好后，出设计图，各种效果的效果图，比如设计稿内要标明，鼠标移上效果会是怎么样，等等，前端再实现这些效果成页面，交给程序员。。。
但是现在很多公司要求设计师连前端工作一起做。。。
前端开发的框架和网页设计有关吗？
网页设计一般包含整站网页视觉方案，提供PSD或PNG格式的主要页面预览图，
高级一点的还会给出标准配色表，风格设计指南（内含一般性风格设计规格：设计理念，
留白间距，按钮样式，使用场景）等附件。大公司一般还有交互设计师，
主要关注人机界面的易用性和用户友好性。
前端开发负责将网页设计和互动设计的方案转换为可工作的Html + Css + js文件。
网站前端开发与网页设计有什么不同
网络建设公司很多，没有具体的衡量标准的。但是可以从几方面去选择：
1 有做了很多精明案例的
2 案例都是可以验证方法的
3 只做网站建设的，没有做别的业务的
4 做的比较久的。
-
android开发还是web前端开发好 javaweb开发和安卓开发哪个前途好些2023-10-08 16:59:01
-
女生学web前端有哪些优势2023-11-14 15:19:01
-
python web开发用什么工具2023-11-09 10:52:52
-
使用vue+vuex+koa2如何搭建开发环境2023-10-28 17:00:56
-
js 原生javascript实现动态引入外部js和css文件2023-06-27 20:13:22
-
八维学院有什么专业？2023-11-19 02:03:42