狠狠撸

狠狠撸Share a Scribd company logo
日新网页设计培训 前台 入门篇 后台程序员:潘泉锦 个人网站: pqj.study.ecjtu.net
还要填鸭式学吗?
这不是一个很难的事 ,你认为难 ,那只是你没信心; 但这也绝对不是一个简单的事 ,因为他所涉及的面很广  你要学的内容很多 , html ->div+css ->javascript ->php (asp, jsp )   学完了吗?
答案当然是  NO!  如果,你是有恒心的,还有 美工( photoshop->flash ) -> 框架 -> 模板引擎 如果,你是更有恒心的,还有 服务器配置  ( win2003->linux )-> 网络安全( sql 注入 , 跨站) ........... 网页设计是一个接入口,可以发展方向还有很多
网页的发展 Web  传统网站 Web  传统网站是一个/slideshow/ss-5315987/5315987/“完美”的/slideshow/ss-5315987/5315987/“和谐社会”,一切即 table , table 即一切。 表格视乎和谐一切…… Web2.0  网站 web2.0  网站 是严格符合 web 标准的网站  这些标准大部分由 W3C 起草和发布,也有一些是其他标准组织制订的标准  网 页主要由三部分组成: 结构( Structure )、表现( Presentation )和行为( Behavior ) 由此产生了  '  网站重构 '  和  'div + css ' 的热潮
谈谈 table 和 div+css 采用 CSS+DIV 相对与传统的 TABLE 网页布局的显著优势: 1 :表现和内容相分离 将设计部分剥离出来放在一个独立样式文件中, HTML 文件中只存放文本信息。 2 :提高搜索引擎对网页的索引效率 用只包含结构化内容的 HTML 代替嵌套的标签,搜索引擎将更有效地搜索到你的网页内容,并可能给你一个较高的评价。 3 :提高页面浏览速度 对于同一个页面视觉效果,采用 DIV+CSS 重构的页面容量要比 TABLE 编码的页面文件容量小得多,前者一般只有后者的 1/2 大小。 4 :易于维护和改版 你只要简单的修改几个 CSS 文件就可以重新设计整个网站的页面,而采用 Table 布局的网站和网页修改起来非常的麻烦。
哪里来呢? 良好的代码习惯 1 )属性名称必须小写 <div  class=/slideshow/ss-5315987/5315987/“ header ”> 网页头部 </div> 2)  属性值必须使用双引号   <div  class=/slideshow/ss-5315987/5315987/“ content ”> 网页内容 </div> 3 )使用 id 代替 name 4)  必须使用结束标签   <div >www.ecjtu.net </div> <br/> <img  src=/slideshow/ss-5315987/5315987/“   ”/>
推荐一本书
推荐几个网站 w3c 在线教程 蓝色理想 cnbeta  资讯站 CSDN.NET -  中国领先的 IT 技术社区
h1-h6 div p  img  table?  th  tr  td a  span  strong  form  input  button  select  option   textarea  label  ul  ol  li  ... 说说你知道的 html 标签
讲讲一些标签 a  ( 锚点  name=&quot;#&quot;)  frame  select option  form  label input  embed
It's  End

More Related Content

Viewers also liked (19)

顿颈惫+肠蝉蝉培训
顿颈惫+肠蝉蝉培训顿颈惫+肠蝉蝉培训
顿颈惫+肠蝉蝉培训
pan quanjin
?
Mark &amp; Caroline
Mark &amp;  CarolineMark &amp;  Caroline
Mark &amp; Caroline
me69
?
Internship presentation
Internship presentationInternship presentation
Internship presentation
Dr. BMN college of Home Science
?
Calci kracker final
Calci kracker finalCalci kracker final
Calci kracker final
Dr. BMN college of Home Science
?
Residential
ResidentialResidential
Residential
MichelePorter
?
Multipurpose sweet herbal powder- a shelf life study
Multipurpose sweet herbal powder- a shelf life studyMultipurpose sweet herbal powder- a shelf life study
Multipurpose sweet herbal powder- a shelf life study
Dr. BMN college of Home Science
?
Report of Dr.BMN College
Report of Dr.BMN CollegeReport of Dr.BMN College
Report of Dr.BMN College
Dr. BMN college of Home Science
?
Pulppy delite final
Pulppy delite finalPulppy delite final
Pulppy delite final
Dr. BMN college of Home Science
?
Multigrain ladoo
Multigrain ladooMultigrain ladoo
Multigrain ladoo
Dr. BMN college of Home Science
?
Pineapple surprise
Pineapple surprisePineapple surprise
Pineapple surprise
Dr. BMN college of Home Science
?
Aneamia and its consequences
Aneamia and its consequencesAneamia and its consequences
Aneamia and its consequences
Dr. BMN college of Home Science
?
Iqac Anu
Iqac AnuIqac Anu
Iqac Anu
Dr. BMN college of Home Science
?
Pregnancy to parenthood
Pregnancy to parenthoodPregnancy to parenthood
Pregnancy to parenthood
Dr. BMN college of Home Science
?
26 inspirational thoughts that will change the way of thinking
26 inspirational thoughts that will change the way of thinking26 inspirational thoughts that will change the way of thinking
26 inspirational thoughts that will change the way of thinking
Devender Bisht
?
A shelf life study of Nutritious quick mix_snack
A shelf life study of Nutritious quick mix_snack A shelf life study of Nutritious quick mix_snack
A shelf life study of Nutritious quick mix_snack
Dr. BMN college of Home Science
?
Biscuit factory
Biscuit factoryBiscuit factory
Biscuit factory
Dr. BMN college of Home Science
?
Diet in Cardiovascular disease
Diet in Cardiovascular diseaseDiet in Cardiovascular disease
Diet in Cardiovascular disease
Dr. BMN college of Home Science
?
Projet d'accès aux résultats des étudiant via client mobile
Projet d'accès aux résultats des étudiant via client mobile Projet d'accès aux résultats des étudiant via client mobile
Projet d'accès aux résultats des étudiant via client mobile
Patrick Bashizi
?
顿颈惫+肠蝉蝉培训
顿颈惫+肠蝉蝉培训顿颈惫+肠蝉蝉培训
顿颈惫+肠蝉蝉培训
pan quanjin
?
Mark &amp; Caroline
Mark &amp;  CarolineMark &amp;  Caroline
Mark &amp; Caroline
me69
?
26 inspirational thoughts that will change the way of thinking
26 inspirational thoughts that will change the way of thinking26 inspirational thoughts that will change the way of thinking
26 inspirational thoughts that will change the way of thinking
Devender Bisht
?
Projet d'accès aux résultats des étudiant via client mobile
Projet d'accès aux résultats des étudiant via client mobile Projet d'accès aux résultats des étudiant via client mobile
Projet d'accès aux résultats des étudiant via client mobile
Patrick Bashizi
?

Similar to 日新培训 (20)

网站重构&补尘辫;奥别产标准设计第二版
网站重构&补尘辫;奥别产标准设计第二版网站重构&补尘辫;奥别产标准设计第二版
网站重构&补尘辫;奥别产标准设计第二版
志勇 孙
?
顿颈惫+肠蝉蝉布局
顿颈惫+肠蝉蝉布局顿颈惫+肠蝉蝉布局
顿颈惫+肠蝉蝉布局
flyxiang228
?
给聚划算后端开发的前端培训
给聚划算后端开发的前端培训给聚划算后端开发的前端培训
给聚划算后端开发的前端培训
j5726
?
十步学会用颁蝉蝉+顿颈惫建站
十步学会用颁蝉蝉+顿颈惫建站十步学会用颁蝉蝉+顿颈惫建站
十步学会用颁蝉蝉+顿颈惫建站
yiditushe
?
[2008]网站重构 -who am i
[2008]网站重构 -who am i[2008]网站重构 -who am i
[2008]网站重构 -who am i
Twinsen Liang
?
让我们的页面跑得更快
让我们的页面跑得更快让我们的页面跑得更快
让我们的页面跑得更快
li qiang
?
网页制作基础
网页制作基础网页制作基础
网页制作基础
loo2k
?
蚕辩.肠辞尘前端架构实践与思考
蚕辩.肠辞尘前端架构实践与思考蚕辩.肠辞尘前端架构实践与思考
蚕辩.肠辞尘前端架构实践与思考
greengnn
?
Web设计 3 java_script初探(程序员与设计师的双重眼光)
Web设计 3 java_script初探(程序员与设计师的双重眼光)Web设计 3 java_script初探(程序员与设计师的双重眼光)
Web设计 3 java_script初探(程序员与设计师的双重眼光)
ziggear
?
闯蝉辫讲义
闯蝉辫讲义闯蝉辫讲义
闯蝉辫讲义
yiditushe
?
Inside the-browser
Inside the-browserInside the-browser
Inside the-browser
jy03845581
?
Inside the-browser
Inside the-browserInside the-browser
Inside the-browser
jy03845581
?
淘宝网前端开发面试题
淘宝网前端开发面试题 淘宝网前端开发面试题
淘宝网前端开发面试题
Lumend
?
快速定位开发常见的前端问题
快速定位开发常见的前端问题快速定位开发常见的前端问题
快速定位开发常见的前端问题
taobao.com
?
Exam 98-375 HTML5 Application Development Fundamentals
Exam 98-375 HTML5 Application Development FundamentalsExam 98-375 HTML5 Application Development Fundamentals
Exam 98-375 HTML5 Application Development Fundamentals
Chieh Lin
?
Inside browser
Inside browserInside browser
Inside browser
mysqlops
?
Responsive Web UI Design
Responsive Web UI DesignResponsive Web UI Design
Responsive Web UI Design
jay li
?
揭秘贬迟尘濒5和颁蝉蝉3
揭秘贬迟尘濒5和颁蝉蝉3揭秘贬迟尘濒5和颁蝉蝉3
揭秘贬迟尘濒5和颁蝉蝉3
Adam Lu
?
揭秘贬迟尘濒5和颁蝉蝉3 ---- 鲁超伍
揭秘贬迟尘濒5和颁蝉蝉3 ---- 鲁超伍揭秘贬迟尘濒5和颁蝉蝉3 ---- 鲁超伍
揭秘贬迟尘濒5和颁蝉蝉3 ---- 鲁超伍
裕波 周
?
网站重构&补尘辫;奥别产标准设计第二版
网站重构&补尘辫;奥别产标准设计第二版网站重构&补尘辫;奥别产标准设计第二版
网站重构&补尘辫;奥别产标准设计第二版
志勇 孙
?
顿颈惫+肠蝉蝉布局
顿颈惫+肠蝉蝉布局顿颈惫+肠蝉蝉布局
顿颈惫+肠蝉蝉布局
flyxiang228
?
给聚划算后端开发的前端培训
给聚划算后端开发的前端培训给聚划算后端开发的前端培训
给聚划算后端开发的前端培训
j5726
?
十步学会用颁蝉蝉+顿颈惫建站
十步学会用颁蝉蝉+顿颈惫建站十步学会用颁蝉蝉+顿颈惫建站
十步学会用颁蝉蝉+顿颈惫建站
yiditushe
?
[2008]网站重构 -who am i
[2008]网站重构 -who am i[2008]网站重构 -who am i
[2008]网站重构 -who am i
Twinsen Liang
?
让我们的页面跑得更快
让我们的页面跑得更快让我们的页面跑得更快
让我们的页面跑得更快
li qiang
?
网页制作基础
网页制作基础网页制作基础
网页制作基础
loo2k
?
蚕辩.肠辞尘前端架构实践与思考
蚕辩.肠辞尘前端架构实践与思考蚕辩.肠辞尘前端架构实践与思考
蚕辩.肠辞尘前端架构实践与思考
greengnn
?
Web设计 3 java_script初探(程序员与设计师的双重眼光)
Web设计 3 java_script初探(程序员与设计师的双重眼光)Web设计 3 java_script初探(程序员与设计师的双重眼光)
Web设计 3 java_script初探(程序员与设计师的双重眼光)
ziggear
?
闯蝉辫讲义
闯蝉辫讲义闯蝉辫讲义
闯蝉辫讲义
yiditushe
?
Inside the-browser
Inside the-browserInside the-browser
Inside the-browser
jy03845581
?
Inside the-browser
Inside the-browserInside the-browser
Inside the-browser
jy03845581
?
淘宝网前端开发面试题
淘宝网前端开发面试题 淘宝网前端开发面试题
淘宝网前端开发面试题
Lumend
?
快速定位开发常见的前端问题
快速定位开发常见的前端问题快速定位开发常见的前端问题
快速定位开发常见的前端问题
taobao.com
?
Exam 98-375 HTML5 Application Development Fundamentals
Exam 98-375 HTML5 Application Development FundamentalsExam 98-375 HTML5 Application Development Fundamentals
Exam 98-375 HTML5 Application Development Fundamentals
Chieh Lin
?
Responsive Web UI Design
Responsive Web UI DesignResponsive Web UI Design
Responsive Web UI Design
jay li
?
揭秘贬迟尘濒5和颁蝉蝉3
揭秘贬迟尘濒5和颁蝉蝉3揭秘贬迟尘濒5和颁蝉蝉3
揭秘贬迟尘濒5和颁蝉蝉3
Adam Lu
?
揭秘贬迟尘濒5和颁蝉蝉3 ---- 鲁超伍
揭秘贬迟尘濒5和颁蝉蝉3 ---- 鲁超伍揭秘贬迟尘濒5和颁蝉蝉3 ---- 鲁超伍
揭秘贬迟尘濒5和颁蝉蝉3 ---- 鲁超伍
裕波 周
?

日新培训

  • 1. 日新网页设计培训 前台 入门篇 后台程序员:潘泉锦 个人网站: pqj.study.ecjtu.net
  • 3. 这不是一个很难的事 ,你认为难 ,那只是你没信心; 但这也绝对不是一个简单的事 ,因为他所涉及的面很广 你要学的内容很多 , html ->div+css ->javascript ->php (asp, jsp ) 学完了吗?
  • 4. 答案当然是 NO! 如果,你是有恒心的,还有 美工( photoshop->flash ) -> 框架 -> 模板引擎 如果,你是更有恒心的,还有 服务器配置 ( win2003->linux )-> 网络安全( sql 注入 , 跨站) ........... 网页设计是一个接入口,可以发展方向还有很多
  • 5. 网页的发展 Web 传统网站 Web 传统网站是一个/slideshow/ss-5315987/5315987/“完美”的/slideshow/ss-5315987/5315987/“和谐社会”,一切即 table , table 即一切。 表格视乎和谐一切…… Web2.0 网站 web2.0 网站 是严格符合 web 标准的网站 这些标准大部分由 W3C 起草和发布,也有一些是其他标准组织制订的标准 网 页主要由三部分组成: 结构( Structure )、表现( Presentation )和行为( Behavior ) 由此产生了 ' 网站重构 ' 和 'div + css ' 的热潮
  • 6. 谈谈 table 和 div+css 采用 CSS+DIV 相对与传统的 TABLE 网页布局的显著优势: 1 :表现和内容相分离 将设计部分剥离出来放在一个独立样式文件中, HTML 文件中只存放文本信息。 2 :提高搜索引擎对网页的索引效率 用只包含结构化内容的 HTML 代替嵌套的标签,搜索引擎将更有效地搜索到你的网页内容,并可能给你一个较高的评价。 3 :提高页面浏览速度 对于同一个页面视觉效果,采用 DIV+CSS 重构的页面容量要比 TABLE 编码的页面文件容量小得多,前者一般只有后者的 1/2 大小。 4 :易于维护和改版 你只要简单的修改几个 CSS 文件就可以重新设计整个网站的页面,而采用 Table 布局的网站和网页修改起来非常的麻烦。
  • 7. 哪里来呢? 良好的代码习惯 1 )属性名称必须小写 <div class=/slideshow/ss-5315987/5315987/“ header ”> 网页头部 </div> 2) 属性值必须使用双引号 <div class=/slideshow/ss-5315987/5315987/“ content ”> 网页内容 </div> 3 )使用 id 代替 name 4) 必须使用结束标签 <div >www.ecjtu.net </div> <br/> <img src=/slideshow/ss-5315987/5315987/“ ”/>
  • 9. 推荐几个网站 w3c 在线教程 蓝色理想 cnbeta 资讯站 CSDN.NET - 中国领先的 IT 技术社区
  • 10. h1-h6 div p img table? th tr td a span strong form input button select option textarea label ul ol li ... 说说你知道的 html 标签
  • 11. 讲讲一些标签 a ( 锚点 name=&quot;#&quot;) frame select option form label input embed