光伏发电国家最新政策,短视频搜索优化,推广计划方案模板,有网址 有空间怎么做网站第一部分 HTML 第一章 职业规划和前景 职业方向规划定位#xff1a; web前端开发工程师 web网站架构师 自己创业 转岗管理或其他 web前端开发的前景展望#xff1a; 未来IT行业企业需求最多的人才 结合最新的html5抢占移动端的市场 自己创业做老板 随着互联网的普及we…第一部分 HTML 第一章 职业规划和前景 职业方向规划定位 web前端开发工程师 web网站架构师 自己创业 转岗管理或其他 web前端开发的前景展望 未来IT行业企业需求最多的人才 结合最新的html5抢占移动端的市场 自己创业做老板 随着互联网的普及web开发成为企业的宠儿和核心 web职业发展目标 起步阶段 提升阶段 成型阶段 基本知识的掌握 常用工具的掌握 沟通技巧的掌握围绕客户的需求 良好的开发习惯加注释、对齐方式 熟悉掌握HTML基本标签和属性 熟练掌握css的基本语法和使用 浏览器兼容和w3c标准的掌握 结合htmlcssjs开始系统项目的开发 精通DIVCCS布局 精通css样式表控制html标签 熟悉运用js制作动态网站的效果 能独立开发完成网站 负责内容的HTML 负责外观的css层叠样式表 负责行为的js ps切图 第一、梳理知识架构 第二、分解目标起步阶段、提升阶段、成型阶段 第二章 html基本结构 认识HTML html不是一种编程语言是一种标志语言 标记语言是由一套标识标签组成的 html使用标签来描述网页 html结构 html    head/head    body/body/html 不成对出现的标签br hr meta img input.. option.. link HTML 基本标签的讲解   strong用于强调文本强度更深表示重要文本---用于SEO优化 b只是视觉加粗效果---单纯为了产生加粗 html head body标签 h1----h6 仅仅用于标题文本不要为了产生粗体文本使用它们 p标签 段落标签 strongb标签 都会让文字产生加粗效果 em i标签 em用于强调文本 i只是视觉斜体效果 strong比em强调更强 特殊符号 nbsp; ----空格 gt; ---大于号 lt---小于号 quot---引号 copy;--版权号 第三章 html基本标签 HTMl基本标签 可以创建一个内容滚动效果 锚点也是一种超链接是页面内进行跳转的超链接 第一步创建锚点 a name锚点名称/a 第二步使用创建好的锚点名称 a href#锚点名称内容/a target属性 _self(在原来页面打开) _blank新窗口打开 _top打开时忽略所有的框架 _parent在父窗口中打开 文字的格式按源码的排版来显示我们称之为预处理格式 对被用来组合文档中的行内元素 注意span没有固定的格式表现当对它应用样式时才会产生视觉上的变化 span标签 pre标签 a标签---他有一个必不可少的属性 href 创建锚点和锚链接 marquee标签 marquee directiondown loop4 οnmοuseοverthis.stop() οnmοuseοutthis.start()/marquee direction 表示滚动方向取值有left,right,up,down,默认left loop 表示滚动循环的次数默认为无限循环 οnmοuseοverthis.stop() οnmοuseοverthis.start() scrollamout1(滚动速度) 表示当鼠标移上区域的时候停止滚动鼠标移开继续滚动 第四章 img图片标签与路径 图片标签与路径 常见图片格式 jpg png gif Gif 只支持全透明 Jpeg /jpg Png 半/全透明都支持 图片标签写法 img src alt width height / 图片四要素 src 图片路径 alt 图片含义 width 图片宽度 和图片大小保持一致 height 图片高度 和图片大小保持一致 title 路径知识 相对路径(Relative Path) 相对于该文件的路径 绝对路径(Absolute Path) 从磁盘出发的路径 相对路径、绝对路径 img src …… align / align属性--设置图片与后面文字的位置关系值--top、bottom、middle、absmiddle、left、right 在静态页面中   /开头表示根目录 ./表示当前目录斜画线前面一个点 ../上级目录斜画线前面两个点 直接用文件名不带/也表示同一目录 这些都是相对于当前文件的位置来说的如果用绝对路径的话就是写全了。 第五章 三种列表的讲解 三种列表的知识讲解 无序列表是一个没有顺序项目的列表此列表项默认粗体圆点进行标识 ul无序列表 ul   li/li   li/li   li/li/ul ol有序列表 有序列表也是一列项目只是列表项目使用的是数字进行标记。 有序列表始于 ol 标签。每个列表项始于 li 标签。 ol   li内容一/li   li内容二/li   li内容三/li/ol 列表符号 typeA A B C D typea a b c d type1 1 2 3 4 默认值typeI I II III typei i ii iii typecircle 空心圆 type“disc” 实心圆 默认值 typesquare 方块符 无序列表-列表符号: 有序列表-列表符号 列表嵌套 无序列表-嵌套 ul li柚子  ul   li沙田柚/li   li蜜柚/li  /ul /li li荔枝/li li苹果/li/ul 有序列表-嵌套 ol li茶  ul   li红茶/li   li绿茶/li  /ul /li li果汁/li li牛奶/li/ol 定义列表 定义列表不仅仅是一列项目而是项目及其注释的组合。定义列表以 dl 标签开始。每个定义列表项以 dt 开始。每个自定义列表项的定义以 dd 开始。 dl       dtpc网页制作/dt       dd学习DIVCSS JS JQ 项目实战/dd       dt手机网页制作/dt       dd手机网页制作实战/dd/dl dd是对dt的解释 dl /dl用来创建一个普通的列表, dt /dt用来创建列表中的上层项目 dd /dd用来创建列表中最下层项目 dt /dt和 dd /dd都必须放在 dl /dl标志对之间。 dl    dt中国城市/dt    dd北京 /dd    dd上海 /dd    dd广州 /dd    dt美国城市/dt    dd华盛顿 /dd    dd芝加哥 /dd    dd纽约 /dd/dl dl是definition list的缩写 dt是definition title的缩写 dd是definition description的缩写 list-style属性具有三个属性分量 list-style-position 设置列表项图标的位置位于文本内或者文本外 list-style-type 设置列表项图标的类型 list-style-image 使用图像设置列表项图标 第六章 表单元素(上) 表单标签: form表单是一个包含表单元素的区域包括起来的都是表单的内容 form表单标签 form input typetext//form HTML标签 - Action和确认按钮 当用户单击确认按钮时表单的内容会被传送到另一个文件。表单的动作属性定义了目的文件的文件名。由动作属性定义的这个文件通常会对接收到的输入数据进行相关的处理。 form actionhtml.do methodget            username:  input typetext nameuser /           input typesubmit value提  交 //form HTML标签 - 隐藏域隐藏标签 隐藏域在页面中对于用户是不可见的在表单中插入隐藏域的目的在于收集或发送信息以利于被处理表单的程序所使用。浏览者单击发送按钮发送表单的时候隐藏域的信息也被一起发送到服务器 form             input typehidden namehid valuevalue/form input标签的掌握 input type name value / typetext 单行文本输入框 typepassword 密码maxlength typeradio 单项选择checkedchecked typecheckbox 多项选择 typebutton 按钮 typesubmit 提交 typeimage 图片提交 typefile 上传文件 typereset 重置 typehidden 隐藏 常用type类型 关于表单中的设置默认值 input typetext name value今天心情不错 /input typeradio name value checkedcheckedinput typecheckbox name value checkedchecked select name  option  value/option option  value selectedselected/optionselect textarea没有默认值 label标签的使用 label 元素不会向用户呈现任何特殊效果。 不过它为鼠标用户改进了可用性。 如果您在 label 元素内点击文本就会触发此控件。 就是说当用户选择该标签时浏览器就会自动将焦点转到和标签相关的表单控件上。 label/label label 标签的 for 属性应当与相关元素的 id 属性相同。 例子重要---注册表单--用户体验--必做 p单向选择/plabel formale男/labelinput typeradio namesex idmale/label fornv女/labelinput typeradio namesexcheckedcheck/ 第七章 表单和表格(下) 表单和表格标签 textarea文本域标签 textarea标签 textarea/textarea是文本域标签可以在其中插入一段文字内容它有两个常用属性rows和cols 注意 rows表示这个文本域有多少行 cols表示这个文本域有多少列 除了这两个属性它还有readonly只读文本域的内容无法改变相当于协议和title鼠标放上提示 select标签的掌握 注当提交表单时浏览器会提交选定的项目或者收集用逗号分隔的多个选项将其合成一个单独的参数列表并且在将 select 表单数据提交给服务器时包括 name 属性 form          select name  id         option value11月/option            option value22月/option      /select/form 常用到的属性disabled“disabled” namesel size2 table表格标签 table表格标签table是表格标签可以用它定义一个表格。 table border1    tr    td姓名/td    td性别/td    /tr/table 注意table的border属性不能少 tr td标签的使用 tr可以定义表格中的一行一个tr/tr表示一行。 tr行标签 table border1tr td姓名/td td性别/td/trtr td姓名/td td性别/td/tr/table td单元格标签: td可以定义表格中的一个单元格td/td表示一个单元格。 table border1trtd 姓名/tdtd性别/tdtd爱好/td/tr/table border-collapse 属性设置是否将表格边框折叠为单一边框 border-collapse:collapse; colspan左右合并 rowspan上下合并 第一部分总结 非可视化标签head meta style scrpit... 可视化标签img div span a ul li... 只有可视化标签才能用css改变它 单标签meta link base img input br hr 双标签html head body div a p span ..ul li ol dl .... 常用可视化标签 慢慢已经被淘汰了 被ul li代替 如果是合并竖排的就是合并行rowspan 如果是合并横排的就是合并列colspan 列表 结论只要将来设计页面中有固定样式的列表就用ul和li src*属性用来设置图片的url数据 alt提供给搜索引擎搜索的 width height 结论 显示图片 href*属性设置跳转的网页地址 target属性设置跳转的目标 结论凡事页面可以点击跳转或者表单提交的文字都用a标签 一般用它来布局 div a 超链接标签 img ul li table caption tr td (th) HTML部分导图总结 HTML5标签集合 转载于:https://www.cnblogs.com/fengyongxian/p/6442012.html