网页设计面试题目

loading 分享 2026-8-12 下载文档

一.HTML常用的标签 ..................................................................................................... 1 二。标签的定义与用法 ........................................................................... 5 三。块级元素和行内元素都有哪些 ............................................................................... 5 四。你真的了解HTML吗 ............................................................................................. 6 五。介绍所知道的CSS hack技巧(如：_， *， +， \\9， !important 之类) ........... 6 六。介绍CSS盒模型 .................................................................................................... 11 七。CSS层叠是什么?介绍一下 ................................................................................... 12 八。都知道哪些CSS浏览器兼容性问题 .................................................................... 12 九。CSS3都有哪些新内容 ........................................................................................... 14 十。CSS3有什么效果可以实现的 ............................................................................... 14

一.HTML常用的标签

1、文本标签加粗打印机字体标签

原样输出强调输出斜体显示加粗字体标签 color:控制字体的颜色 size:控制字体的大小斜体显示下划线上标下标 2、段落标签(自动换行)

属性：align=left | center | right 3、换行标签

属性:color=''; width= n px ;size= n px(不是height); 4、列表标签 a)普通列表

列表标题: 列表项

b)无序列表//ul type=circle disc square

列表项

列表项
列表项

c)有序列表 type= a A I i 1 circle disc square

列表项
列表项
列表项

5、图片和链接标签图片：图片没有加载完成是显示的文字链接：链接的文本 target:链接打开的位置_blanck _self _parent _top 返回 6、地图标签地图标签是基于图片的

7、行内修饰符标签 8、实体字符在html中具有特殊含义的字符，例如常见的空格,< > & &#数字; 或者&实体字符名称的; 例如：空格 " # ' \空格 9、html注释 10、绝对路径与相对路径绝对路径：文件的物理路径(即资源管理器上的路径) 相对路径：相对于本页面的路径 /代表根目录 ./代表当前目录 ../代表父级目录 ./../../代表当前目录的父目录的父目录 11、布局标签 1、table 2、iframe 3、frameset、noframeset

4、div(专门学习) 表格标签

显示的内容

属性： border 边框 bgcolor 表格的背景颜色 bordercolor 边框的颜色 cellspacing 单元格之间的距离 cellpaddig 单元格内容与边框之间的距离 width 表格的宽度 height 表格的高度 valign 垂直位置 top|bottom|middle align 水平位置 right|left|center colspan 和并列 rowspan 合并行 frameset标签 frameset实例 <body> <p>您的浏览器不支持框架,请更新您的浏览器</p> </body> <noframes> </frameset> </html> iframe标签 <html> <head> <title>frameset实例</title> </head> <body> <iframe src='文件名路径' width='' height='' scrolling allowTransparency=''><iframe> </body> </html> </p><p> </p><p>frameborder='0px' </p><p>12、居中标签 <center></center> 13、表单标签 <form action='处理表单的数据的页面' enctype='表单数据的编码形式' method='上传数据的方法'> </form> enctype:3中形式 a)multipart/form-data 文件上传必须的 b)text/plain 纯文本形式上传 c)application/x-www-form-urlencoded 经过url编码后上传 method:2中方法 get:我所有数据通过地址栏 post:表单数据通过协议传递 1、<input type='text' size='用户输入的字符个数' maxlength='用户输入的最大个数' /> type: password:密码框 file:文件上传 submit:确定按钮 button:按钮 reset:重置按钮 radio:当选按钮 checkbox:复选按钮 image:图片按钮(同时传递XY轴坐标) hidden:隐藏域,通常用于传递默认值 2、<select></select>下拉列表 <option></option> <option></option>(位于select标签中间) <optgroup></optgroup>(位于select标签中间) 属性:size下拉框的大小 multiple:是否可以多选 option的属性:selected(下拉列表的默认值) value:下拉表的实际值\\ 3、<label></label>文本标签 4、<textarea><textarea> 属性:cols代表列 rows:代表行 5、fieldset标签(写在form标签的外部) <fieldset> <legend>标题<legend> </fieldset> </p><p> </p><p> </p><p> </p><p>二。<!DOCTYPE>标签的定义与用法 </p><p> </p><p><!DOCTYPE html> </p><p>作用就是加了这行网页按xhtml解析，不加则是按html解析。 </p><p>三。块级元素和行内元素都有哪些 </p><p> </p><p>块级元素(block element) div -最常用的块级元素 </p><p>dl - 和dt dd搭配使用的块级元素 form - 交互表单 h1 - 大标题 hr - 水平分隔线 ol - 排序表单 p - 段落 </p><p>ul - 非排序列表 </p><p>内联元素(inline element) a - 锚点 </p><p>b - 粗体(不推荐) br - 换行 em - 强调 </p><p>font - 字体设定(不推荐) i - 斜体 img - 图片 input - 输入框 label - 表格标签 select - 项目选择 small - 小字体文本 </p><p>span - 常用内联容器，定义文本内区块 strike - 中划线 strong - 粗体强调 sub - 下标 sup - 上标 </p><p>textarea - 多行文本输入框 tt - 电传文本 u - 下划线 </p><p> </p><p></p><div class="page"><ul><li><a href=c53xk63wo911qw0b8dn6k_1.html class="hover" >1</a></li><li><a href=c53xk63wo911qw0b8dn6k_2.html>2</a></li><li><a href=c53xk63wo911qw0b8dn6k_3.html>3</a></li></ul></div> <br /> <p><script type="text/javascript">s("content-m-bot");</script></p> </div> <div class="m-pages"></div> <div class="down-word"> <div class="word-ico"></div> <div class="word-tit"> <span class="docx">网页设计面试题目.doc</span> <span>将本文的Word文档下载到电脑</span> <span><script type="text/javascript">s("content-m-down");</script></span> </div> <div class="word-pic"><a href="javascript:;">下载这篇word文档</a></div> </div> </article> <div class="art-prenext"> 搜索更多关于： <a class="title2" title="网页设计面试题目" href="sp5du45rlqrkxtwirmdu54nhq_1.html">网页设计面试题目</a> 的文档 </div> <div class="main-tab"><a class="on" href="javascript:;">相关推荐</a></div> <script type="text/javascript">s("content-m-like");</script> <div class="main-tab"><a class="on" href="javascript:;">相关阅读</a></div> <div class="tab-box"> <ul class="main-new on clearfix"> <li><a title="Word2007使用技巧大全(超经典)" href=c47ytj4swep7z7sh756b1_5.html>Word2007使用技巧大全(超经典)</a></li><li><a title="C语言五邑大学高潮练习6 答案" href=c5ifma6udhq072ie1yc7k_4.html>C语言五邑大学高潮练习6 答案</a></li><li><a title="英文文献科技类原文及翻译 (电子电气自动化通信) 15" href=c7kjr52zhgk3gznb0fxei_2.html>英文文献科技类原文及翻译 (电子电气自动化通信) 15</a></li><li><a title="六年级奥数" href=c2lj8o1o19g4oweh0pir6_3.html>六年级奥数</a></li><li><a title="销售技巧和话术" href=c2fnae655974c2db011p1797950lpza00fcn_1.html>销售技巧和话术</a></li><li><a title="2016-2022年中国港口码头行业现状深度调研及十三五未来前景预测报告 - 图" href=c4vfcr9ryov507xn0vysx_2.html>2016-2022年中国港口码头行业现状深度调研及十三五未来前景预测报告 - 图</a></li><li><a title="DEC1000-18i-X华中数控实验指导书 - 图文" href=c0i0rs9k3d17yogl1itxx_4.html>DEC1000-18i-X华中数控实验指导书 - 图文</a></li><li><a title="单片机原理及应用习题答案" href=c08dy70qr0u4mg6283we6_3.html>单片机原理及应用习题答案</a></li><li><a title="理财学习题集" href=c3n1sg6llof9mzf00wd7o_8.html>理财学习题集</a></li><li><a title="XXX老年公寓项目可行性研究报告（亚凯公司代写） - 图文" href=c32vmj7s2zt3x5ie1kmyc_2.html>XXX老年公寓项目可行性研究报告（亚凯公司代写） - 图文</a></li> </ul> </div> </div> <footer class="footer"> <p class="bt-links"><a href="https://m.diyifanwen.net/">手机版</a><span class="v-line">|</span><a href="https://www.diyifanwen.net/">PC版</a></p> <p>Copyright © 2018-2023 第一范文网版权所有<br/> 声明 :本网站尊重并保护知识产权，根据《信息网络传播权保护条例》，如果我们转载的作品侵犯了您的权利,请在一个月内通知我们，我们会及时删除。<br>客服QQ：xxxxxx 邮箱：xxxxxx@qq.com<br> <a href="https://beian.miit.gov.cn/" target="_blank" rel="nofollow">渝ICP备2023013149号</a> </p> <script> var _hmt = _hmt || []; (function() { var hm = document.createElement("script"); hm.src = "https://hm.baidu.com/hm.js?1e9741f8c1b2df70963b3e7f3680f749"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s); })(); </script> <script> (function(){ var bp = document.createElement('script'); var curProtocol = window.location.protocol.split(':')[0]; if (curProtocol === 'https') { bp.src = 'https://zz.bdstatic.com/linksubmit/push.js'; } else { bp.src = 'http://push.zhanzhang.baidu.com/push.js'; } var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(bp, s); })(); </script> </footer>  <div class="theme-popover-mask"></div> <script type="text/javascript"> //menu $(".header .menu").on("click", function(){ $("body").append("<div class=\"mask-bg menu-mask-bg\"></div>"); $(".menu-slide").show(); $("html,body").css({height:$(window).innerHeight(), overflow:"hidden"}); setTimeout(function(){ $(".menu-slide").css({transform:"translateX(-50px)"}); },50) }); $("body").on("click", ".menu-mask-bg", function(){ $(".menu-slide").css({transform:"translateX(-100%)"}); $(".menu-mask-bg").remove(); $("html,body").removeAttr("style"); setTimeout(function(){ $(".menu-slide").hide(); },300) }); //search $(".header .search").click(function(){ if($(".search-box").is(":hidden")){ $(this).children("i").removeClass("search-icon").addClass("close-icon"); $(".search-box").fadeIn("fast"); }else{ $(this).children("i").removeClass("close-icon").addClass("search-icon"); $(".search-box").fadeOut("fast"); } }); //nav if($(".nav").length > 0) { var nav = new Swiper(".nav",{ slidesPerView: "auto" }); } </script> <script type="text/javascript"> $(".user-login").click(function () { $(".drop-menu").toggle(); }); </script> <script type="text/javascript"> $(".pay1 img").click(function () { $(".wxpay").css("display", "block"); $(".alipay").css("display", "none"); $(".pay1 img").addClass("over"); $(".pay2 img").removeClass("over"); }); $(".pay2 img").click(function () { $(".wxpay").css("display", "none"); $(".alipay").css("display", "block"); $(".pay1 img").removeClass("over"); $(".pay2 img").addClass("over"); }); </script> <script type="text/javascript"> // var userinfo = function(data) { // if (data.code === "2" || data.code === "3") { // $(".word-pic a").click(function(){ // $(".theme-popover-mask").fadeIn(100); // $(".theme-popover").slideDown(200); // var downid = "53xk63wo911qw0b8dn6k" // $(".tovip a").click(function(){ // var readurl = 'https://www.diyifanwen.net/plus/view.php&psrc='; // var downurl = 'https://www.diyifanwen.net/d.asp?id='; // var payurl = readurl; // payurl = payurl.replace('view.php', 'pay/pay.asp?id=53xk63wo911qw0b8dn6k&p=1'); // var gotourl = payurl + downurl + downid // location.href = gotourl; // }) // }); // } // else{ $(".word-pic a").click(function(){ location.href = "https://www.diyifanwen.net/d.asp?id=53xk63wo911qw0b8dn6k&p=1"; }); // } // } // $(document).ready(function($) { // $(".theme-poptit .close").click(function(){ // $(".theme-popover-mask").fadeOut(100); // $(".theme-popover").slideUp(200); // }); // }); </script> <script src="https://www.diyifanwen.net/js/zfb.js" type="text/javascript"></script> <script src="https://www.diyifanwen.net/user/check_level_m.php?callback=userinfo"></script> <script src="https://m.diyifanwen.net/js/gobacktop.js" type="text/javascript"></script> </body> </html>