HTML、CSS网站开发 （简析）.pptVIP

HTML、CSS网站开发（简析） HTML5技术分享沙龙－2011.07.16 web： 网站开发中的部门职位： 再简单的来说： 一个人（也就是我们说的一条龙） 简单的来说： 前端、后台、数据库 大型的网站开发一般包含： 项目管理 前端后台 测试 文档管理 服务器管理 JavaScript ActionScript CSS、xHTML等“传统”技术 在了解什么叫前端开发前，我们先来看看前端技术包括哪些。 关于前端开发： Adobe AIR Google Gears 以及概念性较强的交互式设计,艺术性较强的视觉设计等等。 我们来看下招聘信息上对前端开发的要求（截图来源：前程无忧） 关于前端开发： 1、能运用（精通）JS，能熟练应用Jquery 2、懂CSS，能够用DIV+CSS进行网站开发 3、当然，你还需要会用photoshop。 在我们实际的开发过程中，通常这样定位前端开发人员： 关于前端开发： 如今的前端开发人员已经不仅仅局限于关注用户所能看到的界面部分，他们更多的关注的是是否能让用户获得良好的体验。 关于前端开发： 前端开发工程师 或者说“网页制作”、“网页制作工程师”、“前端制作工程师”、“网站重构工程师” ，这样的一个职位的主要职责是与交互设计师、 视觉设计师协作，根据设计图用HTML和CSS完成页面制作。同时，在此基础之上，对完成的页面进行维护和对网站前端性能做相应的优化。 对于要求更高的前端开发工程师，还需要使用JavaScript或者ActionScript来编写和封装具有良好性能的前端交互组件，同时还要对Web项目的前端实现方案，提供专业指导和监督并在日常工作之中对新人及相关开发人员进行前端技能的培训和指导。 另外，还要跟踪研究前端技术，设计并实施全网前端优化。 关于前端开发： 前端开发所用到的工具 设计类：Photoshop 原型类：Balsamiq Mockups 调试类：firebug 前端作为与用户直接发生关系的一层，与用户的相关度高，需求变化也更频繁。 关于前端开发： HTML、CSS（格式、语法、书写规范） html head …… titleHTML5交流沙/title /head body /body /html HTML文件的基本格式： HTML、CSS（格式、语法、书写规范） CSS的格式： [1].内联的: p style=color:redtext/p [2].放在head 之间: head style type=text/css a:link, a:visited{ text-decoration:none; } /style [3]实用外部的CSS文件 如在head/head之间加入 link href=style.css rev=stylesheet type=text/css / HTML、CSS（格式、语法、书写规范） CSS的语法： H1 { color:red; font-size:14px; } 为了提高Style代码的可读性，你也可以分行写： HTML、CSS（格式、语法、书写规范） CSS的语法： /* 段落样式 */ P { text-align: center; color: black; font-family: arial } /* 字体格式 */ h1,h2,h3,h4,h5,h6 { color: red } 为了方便你自己或者他人日后更好地理解你的CSS代码，你可以写CSS代码注释。 CSS代码注释以/*开头，以*/结束。 HTML、CSS（格式、语法、书写规范） id选择符 每一个标签都可以使用一个id=的形式进行一个名称指派，但需要注意，id是具有唯一性而不可以重复的。 div id=content/div class选择符 id是对于标签的扩展，而class是对多个标签的一种组合，class直译的意思是类或类别。class可以重复使用，对于多个样式相同的元素。 p class=he/p span class=he/span h5 class=he/h5 HTML、CSS（格式、语法、书写规范） 当使用css定义字体时你可能会这样做： font-size: 1em; line-height: 1.5em; font-weight: bold; font-style: italic; font-variant: small-caps; font-family: verdana,serif; CSS 简写规则 事实上你可以简写这些属性： font: 1em/1.5em bold itali