黑马程序员：javaweb基础阶段笔记之第一章WEB01-HTML篇
黑马程序员：javaweb 基础阶段笔记之第一章WEB01-HTML 篇今日任务网站信息页面案例网站图片信息页面案例网站友情链接页面案例网站首页案例网站注册页面案例网站后台页面案例教学导航1.1 案例一：网站信息页面的显示：1.1.1 需求：在网页中显示网站的信息的页面：效果如下：1.1.2分析:1.1.2.1技术分析：【HTML的概述】什么是HTMLHTML:Hyper Text Markup Language --- 超文本标记语言.* 标记语言：指的是通过一组标签的形式描述事物的一门语言.* 超文本：比普通的文本更强大.HTML的作用HTML是用来制作页面(静态页面).HTML在那些地方使用在设计网站的页面的时候都要使用到HTML.【HTML的使用】HTML的文件的创建一个HTML文件,扩展名是.html或者.htm结尾* 01.htmlHTML的结构标签* 跟标签:<html></html>* <head> -- html的头标签* <body> -- html的体标签【HTML的字体标签】<font>标签:HTML中的字体标签.使用：<font>文字</font>* <font>标签的属性:* <标签属性名=”属性值”属性名=”属性值”></标签>* 属性:* color属性:字体颜色* 英文单词设置:black,red,green,blue...* 使用16进制数设置:#FF FF FF , #F F F* size属性:字体的大小* face属性:字体* 基本使用：<font>我是HTML!</font> <br/><font color="red">我是HTML！</font><br/><font color="#FF0000" size="1">我是小红！</font><br/><font color="#00FF00" size="7">我是小绿！</font><br/><font color="#0000FF" size="100">我是小蓝！</font><br/>【HTML的排版标签】标题标签：h标签<h1>...<h6><!-- HTML的标题标签--><h1>一级标题</h1><h2>二级标题</h2><h3>三级标题</h3>段落标签：p标签<p>一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容</p><p>一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容一段内容内容</p>字体加粗标签：b标签<b>黑马训练营</b>字体斜体标签：i标签<i>黑马训练营</i>字体下划线：u标签<u>黑马训练营</u>居中标签：<center>标签<center>内容</center>1.1.2.2步骤分析:【步骤一】创建一个HTML的文档【步骤二】设置标题【步骤三】设置四个段落【步骤四】使用字体标签将第一个段落中的某个部分的内容变为红色.1.1.3代码实现:<!DOCTYPE html><html><head><meta charset="UTF-8"><title>网站信息页面</title></head><body><h1>公司简介</h1><hr /><p><font color="red">“中关村黑马程序员训练营”</font>是由<b>传智播客</b>联合中关村软件园、CSDN，并委托传智播客进行教学实施的软件开发高端培训机构，致力于服务各大软件企业，解决当前软件开发技术飞速发展，而企业招不到优秀人才的困扰。
目前，“中关村黑马程序员训练营”已成长为行业“学员质量好、课程内容深、企业满意”的移动开发高端训练基地，并被评为中关村软件园重点扶持人才企业。
</p><p>黑马程序员的学员多为大学毕业后，有理想、有梦想，想从事IT行业，而没有环境和机遇改变自己命运的年轻人。
黑马程序员的学员筛选制度，远比现在90%以上的企业招聘流程更为严格。
任何一名学员想成功入学“黑马程序员”，必须经历长达2个月的面试流程，这些流程中不仅包括严格的技术测试、自学能力测试，还包括性格测试、压力测试、品德测试等等测试。
毫不夸张地说，黑马程序员训练营所有学员都是精挑细选出来的。
百里挑一的残酷筛选制度确保学员质量，并降低企业的用人风险。
</p><p>中关村黑马程序员训练营不仅着重培养学员的基础理论知识，更注重培养项目实施管理能力，并密切关注技术革新，不断引入先进的技术，研发更新技术课程，确保学员进入企业后不仅能独立从事开发工作，更能给企业带来新的技术体系和理念。
</p><p>一直以来，黑马程序员以技术视角关注IT产业发展，以深度分享推进产业技术成长，致力于弘扬技术创新，倡导分享、开放和协作，努力打造高质量的IT人才服务平台。
</p></body></html>1.1.4总结:HTML有标准:* HTML4* <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> * HTML5:支持视频播放,支持CSS3,支持定位,扩展标签...* <!DOCTYPE html><pre>标签：原生标签.<hr/>标签：横线.1.2案例二：网站图片页面显示：1.2.1需求：在一个页面中往往图文并茂.想在HTML中引入一个图片如何处理?效果如下:1.2.2分析:1.2.2.1技术分析:【HTML的图片标签】图片标签:<img>* 属性:* src :图片的来源.* width :图片的宽度.* height:图片的高度.* alt :图片找不到显示的内容.图片的引入的路径问题:* 路径：相对路径.* 如果引入的图片和html文件在同一级路径。
* 直接写文件名或者./文件名<img src="cs10006.jpg" /><img src="./cs10006.jpg" />* 如果引入的图片在html文件的上一级路径。
* <img src="../cs10006.jpg" />* 如果引入的图片在html文件的下一级路径。
* <img src="img/cs10006.jpg" />1.2.2.2步骤分析:【步骤一】创建一个html的文档【步骤二】引入两张图片显示到页面1.2.3代码实现：<img src="logo2.png" height="50" width="200"/><img src="header.png" height="50" width="250"/>1.3案例三：网站列表页面的显示1.3.1需求：在网站的友情链接页面显示网站的所有的友情链接.1.3.2分析：1.3.2.1技术分析：【HTML的列表标签】●有序列表<ol><li></li></ol>●无序列表<ul><li></li></ul>【HTML的超链接标签】HTML的超链接标签：<a>* 属性:* href :链接的路径* target :打开的方式* _self :在自身页面打开* _blank :新打开一个窗口1.3.2.2步骤分析：【步骤一】创建一个html的文档【步骤二】创建一个无序列表【步骤三】在无序列表中添加超链接标签.1.3.3代码实现：<ul><li><a href="../案例一：网站信息页面的显示/案例一：网站信息页面的显示.html">传智播客</a></li><li><a href="" target="_self">百度</a></li><li><a href="" target="_blank">网易</a></li><li>百合</li></ul>1.3.4总结：无序列表的属性:* type属性* disc ：实心点.* circle ：空心圆* square ：方块.有序列表的属性:* type属性:* 1 ：数字类型* a ：英文类型* i ：罗马字符* start属性:从哪开始超链接的target属性:* _self* _blank* _parent1.4案例四：网站的首页的显示：1.4.1需求：网站的首页的设计：1.4.2分析：1.4.2.1技术分析：【HTML的表格标签】<table><tr><td></td><td></td></tr></table>属性:width :表格宽度height :表格高度border :边框align :表格水平位置:* left* center* right<td>的属性:* colspan=”列数”* rowspan=”行数”1.4.2.2步骤分析：【步骤一】创建一个html的页面【步骤二】创建一个8行1列的表格【步骤三】为每行内容填充数据. 1.4.3代码实现:1.5案例五：网站的注册页面的显示：1.5.1需求：使用HTML完成注册页面的设计：1.5.2分析：1.5.2.1技术分析【HTML的表单标签（*****）】HTML的表单标签：<form>* 常用属性:* action属性:提交的路径.默认提交到当前页面* method属性:请求的方式.GET和POST.默认是GET.***** GET方式和POST方式的区别?* GET :数据会显示到地址栏中.GET方式提交是有大小的限制.* POST :数据不会显示到地址栏中.POST方式提交的是没有大小限制. HTML中表单元素：* <input type=”text”> :文本框.* 常用属性:* name :表单元素的名称.必须有name属性，然后后台才可以接收数据.* value :文本框的默认值.* size :文本框的长度.* maxlength:文本框输入的最大长度.* readonly:只读文本框.* <input type=”password”> :密码框.* 常用属性:* name :表单元素的名称.必须有name属性，然后后台才可以接收数据.* value :密码框的默认值.* size :密码框的长度.* maxlength:密码框输入的最大长度.* <input type=”radio”> :单选按钮.* 常用的属性:* name :表单元素的名称.必须有name属性，然后后台才可以接收数据.* value :单选按钮的默认值.* checked:单选按钮默认被选中.* <input type=”checkbox”> :复选按钮.* 常用的属性:* name :表单元素的名称.必须有name属性，然后后台才可以接收数据.* value :单选按钮的默认值.* checked:单选按钮默认被选中.* <input type=”button”> :普通按钮.没有任何功能的按钮.* <input type=”submit”> :提交按钮.* <input type=”reset”> :重置按钮.* <input type=”file”> :文件上传的表单项.* <input type=”hidden”> :隐藏字段.* <input type=”image”> :图片按钮* <select> :下拉列表.* <textarea> :文本域.1.5.2.2步骤分析：【步骤一】创建一个html的文档【步骤二】使用表格布局页面【步骤三】在页面中使用表单标签完成注册页面1.5.3代码实现<!DOCTYPE html><html><head><meta charset="UTF-8"><title></title></head><body><table border="1" width="90%" align="center"><tr><td><!--Logo部分--><table width="100%" border="1"><tr><td><img src="img/logo2.png" /></td><td><img src="img/header.png" /></td><td><a href="#">登录</a><a href="#">注册</a><a href="#">购物车</a></td></tr></table></td></tr><tr><td><table width="100%" border="1" bgcolor="black" height="100%"><tr><td><a href="">首页</a> <a href="">手机数码</a> <a href="">电脑办公</a> <a href="">烟酒糖茶</a> <a href="">鞋靴箱包</a> </td></tr></table></td></tr><tr height="400" background="img/regist_bg.jpg"><td><form action="../案例四：网站的首页的显示/案例四：网站首页.html" method="post"><table border="5" width="60%" align="center" bgcolor="white"><tr><td>用户名</td><td><input type="text" name="username" value="" size="20" maxlength="6" ></td></tr><tr><td>密码</td><td><input type="password" name="password"/></td></tr><tr><td>确认密码</td><td><input type="password" name="repassword"/></td></tr><tr><td>邮箱</td><td><input type="text" name="email"/></td></tr><tr><td>姓名</td><td><input type="text" name="name"/></td></tr><tr><td>性别</td><td><input type="radio" name="sex" value="男" checked>男<input type="radio" name="sex" value="女">女</td></tr><tr><td>爱好</td><td><input type="checkbox" name="hobby" value="篮球" checked>篮球<input type="checkbox" name="hobby" value="足球">足球<input type="checkbox" name="hobby" value="排球">排球<input type="checkbox" name="hobby" value="羽毛球">羽毛球</td></tr><tr><td>籍贯</td><td><select name="province"><option>--请选择--</option><option value="北京" selected>北京</option><option value="上海">上海</option><option value="广州">广州</option></select></td></tr><tr><td>头像</td><td><input type="file" name="upload"></td></tr><tr><td>简介</td><td><textarea cols="20" rows="4" name="info">我是：</textarea></td></tr><tr><td>生日</td><td><input type="text" name="birthday"/></td></tr><tr><td colspan="2"><input type="submit" value="注册"/><input type="reset" value="重置"/><input type="button" value="我是按钮"></td></tr></table></form></td></tr><tr><td height="70"><img src="img/footer.jpg" width="100%" height="100%"></td></tr><tr><td align="center"><a href="../案例一：网站信息页面的显示/案例一：网站信息页面的显示.html">关于我们</a> 联系我们招贤纳士法律声明<a href="../案例三：网站列表页面的显示/案例三：网站列表页面的显示.html">友情链接</a> 支付方式配送方式服务声明广告声明<br/>Copyright © 2005-2016 传智商城版权所有</td></tr></table></body></html>1.5.4总结：1.5.4.1HTML5扩展的表单标签.(*****h5不是所有浏览器都支持)<input type=”email”><input type=”date”><input type=”number”><input type=”color”>1.6案例六：网站的后台页面的显示：1.6.1需求：一个网站需要有后台页面,后台页面设计：1.6.2分析：1.6.2.1技术分析：【HTML的框架标签】框架标签:<frameset >,标签与body标签是冲突,有frameset就可以没有body.* 属性:* rows* cols使用<frame>标签，frame代表切分的每个部分.1.6.2.2步骤分析:【步骤一】创建一个html的页面【步骤二】将整个页面分成上下两个部分.【步骤三】将页面的下半部分分成左右两个部分.【步骤四】在左侧页面中添加一些链接.【步骤五】点击左侧链接,将页面的内容显示到右侧.1.6.3代码实现：<frameset rows="15%,*"><frame src="top.html" name="top"/><frameset cols="15%,*"><frame src="left.html" name="left"/><frame src="right.html" name="right"/> </frameset></frameset>1.6.4总结：1.6.4.1特殊字符的标签：空格 : < :<> :>。
黑马程序员_javaweb讲义和笔记资料
黑马程序员_javaweb讲义和笔记资料
黑马程序员提供的JavaWeb讲义和笔记资料非常详尽，对于学习JavaWeb开发的人来说非常有用。
这些资料涵盖了JavaWeb开发的基础
知识，包括HTML、CSS、JavaScript、Servlet、JSP等方面的内容。
以下是一些黑马程序员提供的JavaWeb讲义和笔记资料的介绍：
1. JavaWeb基础笔记：这是一份详细的笔记，涵盖了JavaWeb开发的基
础知识，包括HTTP协议、Web服务器、Web应用程序架构等方面的内容。
2. JavaWeb进阶笔记：这是一份进阶的笔记，主要介绍了JavaWeb开发
的高级技术，包括多线程、JavaMail、JNDI等方面的内容。
3. JavaWeb实战笔记：这是一份实战的笔记，通过多个案例介绍了JavaWeb开发的实际应用，包括文件上传、在线聊天室、在线购物等方面
的内容。
4. JavaWeb讲义：这是一份详细的讲义，介绍了JavaWeb开发的整个流程，包括开发环境的搭建、HTML/CSS/JavaScript的使用、Servlet/JSP的使用等方面的内容。
这些资料都是黑马程序员精心整理的，非常适合初学者和有一定Java基础的开发者使用。
通过学习这些资料，可以快速掌握JavaWeb开发的基本知识和技能，提高自己的开发能力。
黑马程序员HTML、CSS学习笔记
⿊马程序员HTML、CSS学习笔记HTML：//预格式化：保留⽂字在源代码中的格式，页⾯中显⽰的和源代码中的效果完全⼀致。
浏览器在显⽰其中的内容时，会完全按照其真正的⽂本格式来显⽰。
例如，原封不动地保留⽂档中的空⽩，如空格、制表符等。
//HTML中空格的显⽰：使⽤ 或者加空格的时候将输⼊法设为全⾓。
//超链接：指从⼀个⽹页指向⼀个⽬标的连接关系，这个⽬标可以是另⼀个⽹页，也可以是相同⽹页上的不同位置，还可以是⼀个图⽚、⼀个电⼦邮件地址、⼀个⽂件或者⼀个应⽤程序。
超⽂本链接是超链接的⼀种，是指⽤⽂字链接的形式来指向⼀个⽬标。
HTML⽂档类型:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "/TR/xhtml1/DTD/xhtml1-transitional.dtd">//只有确定了正确的DOCTYPE，XHTML⾥的标识和级联样式才能正常⽣效。
在HTML 1.0中有3种DTD声明可以选择，过度的Transitional、严格的Strict和框架的Frameset。
使⽤严格的DTD来制作页⾯当然是最理想的⽅式，但对于没有深⼊了解Web标准的⽹页设计者，⽐较合适的是使⽤过渡的DTD。
因为这种DTD还允许使⽤表现层的标识、元素和属性。
<!DOCTYPE html>：可以这样写⽽不⽤声明DTD。
基本结构：<!--注释内容-->//注释标签⽤来在源⽂档中插⼊注释，注释会被浏览器忽略。
<html>//html元素可告知浏览器这是⼀个html类型的⽂档。
<head>//定义在html语⾔头部的内容不会在⽹页上直接显⽰，它⽤于包含当前⽂档的相关信息，可以包含title元素、meta元素等。
<title></title>//页⾯标题元素。
黑马程序员_javaweb讲义和笔记资料
黑马程序员_javaweb讲义和笔记资料一、简介黑马程序员是一家专业的IT培训机构，提供全面的编程技术培训服务。
javaweb是其中的一门重要课程，本文为黑马程序员_javaweb讲义和笔记的资料整理。
二、javaweb基础知识1. Java语言概述Java语言的特点和优势，Java开发环境的搭建等。
2. Servlet技术Servlet的基本概念、生命周期、Servlet容器等。
3. JSP技术JSP的基本语法、JSP指令、JSP内置对象等。
4. MVC设计模式MVC设计模式在javaweb开发中的应用和实践。
三、javaweb开发流程1. 需求分析分析项目需求，明确开发目标和功能要求。
2. 数据库设计设计数据库表结构，确定数据存储方式和关系。
3. 技术选型根据项目需求和开发要求，选择合适的技术框架和工具。
4. 编码实现使用Java语言和相关技术进行编码实现。
5. 测试调试运行和调试项目，确保功能的正确性和稳定性。
6. 部署上线将项目部署到服务器上线，提供给用户访问和使用。
四、javaweb开发常用框架和工具1. Spring框架Spring框架的介绍和核心特性，以及在javaweb开发中的应用。
2. SpringMVC框架SpringMVC框架的详细讲解，包括请求映射、数据绑定、视图解析等。
3. MyBatis框架MyBatis框架的使用方法和技巧，以及与数据库的集成。
4. Maven工具Maven的基本使用和配置，常用插件介绍。
五、javaweb开发中的常见问题和解决方案1. 数据库连接异常分析数据库连接异常的原因和解决方法。
2. 页面跳转问题页面跳转的实现方式和常见错误排查。
3. 表单数据验证表单数据验证的常用技术和插件，提高数据输入的准确性和安全性。
4. 性能优化优化javaweb应用的性能，减少响应时间和资源占用。
六、实例项目提供一个实例项目，通过对该项目的讲解和分析，帮助学员理解和掌握javaweb开发的方法和技巧。
JAVA_WEB01_DOC_01_HTML
1.HTML1.1.HTML概述1.1.1.HTML是什么Html(Hyper Text Mark-up Language)就是超文本标记语言的简写，是最基础的网页语言。
实验：查看网页的源代码1.1.2.HTML基本结构Html是通过标签来定义的语言，代码都是由标签所组成。
Html代码不用区分大小写。
Html代码由<html>开始</html>结束。
里面由头部分<head></head>和体部分<body></body>两部分组成。
头部分是给Html页面增加一些辅助或者属性信息，它里面的内容会最先加载。
体部分是真正存放页面数据的地方。
练习：第一个HTML页面练习：修改页面标题1.1.3.HTML语法细节多数标签都是有开始标签和结束标签，也有个别标签因为只有单一功能，或者没有要修饰的内容可以在标签内结束。
标签通常可以具有属性，通过对属性值的改变，控制标签具体功能效果。
属性与属性值之间用“=”连接，属性值可以用双引号或单引号或者不用引号，一般都会用双引号。
格式：<标签名属性名='属性值'> 数据内容 </标签名><标签名属性名='属性值' />练习：修改第一个HTML页面，加入一些文字，控制大小及颜色练习：html页面中的空格和回车1.2.字体标签1.2.1.Font标签例：<font size=5 color=red>字体标签示例</font>注：简单颜色可是直接写对应的英文，复杂颜色用16进制表示，表现形式#FF0000两个数为一组，按红，绿，蓝排列，如：#00FF00表示绿色。
建议用工具选取，如图-1所示：图-1Size，默认1-7，默认是3，也可以-2~+41.2.2.标题标签因为标题是文本中常用的内容，为了方便操作而定义的。
其实就是某个字号和粗体的组合。
web前端笔记整理一---HTML
web前端笔记整理⼀---HTML ⼀ HTML标签1 页⾯及标记1 HTML ⽂件结构拓展名 .html或者.htm<!DOCTYPE html>// 声明<html> html 主体<head></head> 头信息：浏览器，搜索引擎使⽤ title<body> // ⽤户看的hello wroldhello wrold</body></html>2 语⾔字符集(Charsets)的信息<meta http-equiv="Content-Type" content="text/html;charset=#">常⽤utf-8,gb2312 最好⾃⼰在浏览器的选项菜单内选择相应的语⾔3 背景⾊彩和⽂字⾊彩背景图象 <body background="image-URL">4 图⽚路径<img src="static/images/1.jpg"alt="这个是alt" /><!-- 当前⽬录下查找 -->5 链接<a>跳转到页⾯的另外⼀个地⽅<a href="#name"> ... </a><a name="name"> ... </a><a href="samp/window.html" target="_blank">开⼀个新窗⼝!</a>6 标尺线标尺线<hr size=10>⼆⽂字及⽂字布局1 6级标题<h1>…<h1/>到 <h6>…<h6/>2 ⽂字变化<b>加粗</b><em>斜体</em><i>斜体</i><small>变⼩</small><strong>加强加粗</strong><sub>上标</sub><sup>下标</sup>3 布局标签<!--布局标签--><!--div:⼤的块元素span:⼩的块元素ul li：列表dl dt dd：列表换⾏ <br><p>段落div span ul li dl dt dd4 表格表单<table>...</table> - 定义表格<tr> - 定义表⾏<th> - 定义表头<td> - 定义表元(表格的具体数据)<!--表格--><table><tr><td></td></tr></table>Form表单：method：post get put delete⽂件上传：Method postMultity-post-data单选框：radio复选框：checkbox输⼊：input传递⽅式：Get: url 地址传值 256字符Post: 后台：推荐这个placeholder="请输⼊⽤户名"<form action="url" method=*>......<input type=submit> <input type=reset></form>5 移动⽂字<marquee>啦啦啦，我会移动耶！</marquee>。
学习笔记整理
1.Internet：互联网；信息共享；
2.Internet提供的主要服务：Telnet（远程登录）、Email；
3.基本实现技术：
-分组交换原理：信息在Internet上被分成许多小数据包（分组）进行传输，到达目的后将数据包重组为信息；
-解释说明；
<!--------html注释-------->
/*********css注释*********/
-注释是不能嵌套；
<!--
<!----错误----->
-->
-注释不能写在标签声明里；
<a <!-----错误----->></a>
4.HTML与XHTML
1999年12月24日，W3C推荐标准HTML4.01；
-超文本：超文本文件是WEB的基本组成单元，也称为网页或HTML文档、web页等，通常以.html或.htm、.shtml为后缀的文件；web页通过超链接组织在一起；
- web页之间通过超文本中的超级链接组织在一起；
HTML HyperText Markup Language超文本标记语言
-使用带尖括号的“标记”将网页的内容逐一标识出来；
-标题：<title></title>:标签页，没有任何属性，只能出现在head里；
3.网页编码格式：
1.默认编码：ISO-8859-1 ->不支持中文；
-改编码，通过meta标签
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
【黑马程序员】Web前端学习教程基础知识学习
【黑马程序员】Web前端学习教程基础知识学习1.web标准：web标准分三层结构，分别是结构（html）、表现（css）和行为（javascript）2.html的语言语法骨架格式：<html><head><title></title></head><body></body></html>3.html标签分类：常规元素（双标签），空元素（单标签）4.HTML标签关系：html的标签关系分2种，分别是嵌套关系和并列关系。
5.html标签语义化的目的：一、方便代码的阅读和维护。
二、同时让浏览器或是网络爬虫可以很好地解析，从而更好分析其中的内容。
三、使用语义化标签会具有更好地搜索引擎优化。
6.html的常用标签：标题标签h 、段落标签p 、水平线标签hr(认识)、换行标签br、div和 span标签、文本格式化标签（b、strong、i、em、s、del、u、ins）、图像标签img、链接标签a、注释标签<!-- -->7.路径：相对路径（一、同一级路径，二、下一级路径，三、上一级路径），绝对路径。
8.表格的基本结构骨架：<table><tr><td>单元格内的文字</td>...</tr>...</table>9.表格合并单元格：跨行合并：rowspan="合并单元格的个数" ，跨列合并：colspan="合并单元格的个数"，单元格合并三步曲（一、先确定是跨行还是跨列合并，二、根据先上后下先左后右的原则找到目标单元格然后写上合并方式还有要合并的单元格数量，三、删除多余的单元格单元格）10.列表：有序列表ol+li、无序列表ul+li、自定义列表dl+dt+dd（一般常用列表来做布局）11.表单：目的是为了收集用户信息。
javaweb的html语言知识点
一、HTML的基本概念与作用HTML（Hyper Text Markup Language）是用来描述网页结构的一种标记语言，它由一系列的标签组成，这些标签能够告诉浏览器如何显示页面的内容。
HTML的作用是为网页添加结构和语义，让浏览器能够正确地解释页面的内容并以用户友好的方式呈现出来。
二、HTML的基本结构在编写HTML页面时，一般都会遵循以下基本结构：```html<!DOCTYPE html><html><head><meta charset="UTF-8"><title>页面标题</title><link rel="stylesheet" href="styles.css"><script src="script.js"></script></head><body><!--页面内容--></body></html>```其中，`<!DOCTYPE html>` 用来声明文档类型，tell the browser which version of HTML the page is written in. `<html>` 标签用来定义整个HTML文档，`<head>` 标签用来包含文档的元数据（meta data），如字符编码、页面描述、样式表信息、脚本引用等。
`<body>` 标签用来包含实际的页面内容，如文本、图片、媒体等。
三、HTML的常用标签1. 标题标签在HTML中，标题标签用来表示文档的标题，一共有6个不同的级别：`<h1>` - `<h6>`，数字越小表示的级别越高。
黑马程序员web前端课程笔记
黑马程序员web前端课程笔记【最新版】目录1.黑马程序员 web 前端课程简介2.课程学习内容3.课程学习成果4.学习建议5.未来发展正文【黑马程序员 web 前端课程简介】黑马程序员 web 前端课程是一门针对想要成为 web 前端工程师的学员开设的课程。
该课程旨在帮助学员深入理解并熟练掌握 html、css、js 等前端技术，从而能够开发并优化网站，提升用户体验。
【课程学习内容】1.HTML：HTML 是前端开发的基础，学员需要掌握 HTML 的基本语法、常用标签以及如何编写语义化的 HTML 结构。
2.CSS：CSS 是用来美化网页的语言，学员需要掌握 CSS 选择器、盒模型、布局、颜色、字体等知识，并能够利用 CSS 进行页面布局和美化。
3.JavaScript：JavaScript 是用来实现网页交互的语言，学员需要掌握 JavaScript 的基本语法、数据类型、函数、事件处理、DOM 操作等知识，并能够利用 JavaScript 实现网页的动态交互。
【课程学习成果】通过学习这门课程，学员能够熟练掌握前端开发的基本技术，并能够开发出功能完善、用户体验良好的网站。
此外，学员还能够提升自己的编程能力和解决问题的能力，为将来的职业生涯奠定坚实的基础。
【学习建议】1.认真听课：学员应该充分利用课堂时间，认真听讲，理解并掌握老师讲解的知识点。
2.多做练习：前端开发需要大量的实践，学员应该多做练习，将理论知识转化为实际操作能力。
3.积极参与讨论：学员应该积极参与课堂讨论，提出自己的问题和看法，与老师和同学进行交流和碰撞，以提升自己的理解和能力。
4.定期复习：学习新知识的同时，学员也应该定期复习旧知识，以巩固和加深理解。
【未来发展】前端开发是互联网行业的热门领域，拥有广阔的发展前景。
JavaWeb笔记——HTML语言基本规则
JavaWeb笔记——HTML语⾔基本规则⽬录HTML语⾔基本规则⼀、HTML语⾔的结构HTML的代码由头和体组成<html><head><title>标题</title></head><body><font color="red">HTML⼊门案例</font></body></html>// 标签相当于Java的⼤括号// 标签⾥⾯存放的是⽹页的说明性内容，如标题// 标签中是内容主题，如⽹页上要输出的内容HTML⽂件的扩展名为“html”或“htm”HTML⽂件由浏览器直接解析，⾃上⽽下的执⾏HTML标签通常以开始标签和结束标签组成，如：签叫做空标签。
仅由⼀个标签组成，如，⾃关闭HEML标签不区分⼤⼩写，但是为了⽅便阅读，建议同意使⽤⼩写HEML标签是有属性的，格式为：属性名="属性值"，属性值⽤引号引起HEML⽂件建议使⽤包裹嵌套，不建议使⽤交叉嵌套⼆、基础标签1. 字体标签<!--<font></font>标签，字体标签（建议使⽤样式）属性：color：调整字体的颜⾊face：调整字体，字体要为库中已有的字体，如楷体size：调整字体的⼤⼩（1-7），1最⼩，7最⼤如：--><font color="aquamarine" face="楷体" size="5" >越来越好</font>2. 格式化标签<!-- 格式化标签<h1>标题</h1>h1最⼤，h6最⼩HTML并不会识别源码中的换⾏和空格符号（空格在⼤于⼀个时也只会识别⼀个），需要⼿动加⼊   空格符号<br/> 换⾏<p>段落 </p> 划分段落，段前段后留出空⾏align:段落内容的对其⽅式默认居左（建议使⽤样式）left 居左right 居右center 居中-->3. 图⽚标签<!-- 图⽚标签<img src="图⽚路径"/>设置图⽚的⾼度和宽度时，要注意单位，默认单位是px如："width=400"表⽰的是"width=400px"还可以设置图⽚所占⽗标签的百分⽐即："wifth=50%"表⽰的是图的宽度占⽗标签的50%图⽚路径内⽹路径：相对路径：如：<img src="../img/屏幕截图%202021-02-24%20094605.png" width="100%" />../表⽰上⼀⽬录./表⽰当前⽬录绝对路径：⽂件在硬盘上的具体位置如：C:\Users\xcz\Desktop互联⽹路径：前⾯必须加上 http://如：/xxx.png-->4. 列表标签<!--列表标签⽆序列表：<ul> </ul> ⽤于定义⼀个⽆序列表有序列表：<ol> </ol> ⽤于定义⼀个有序列表列表条⽬：<li> </li> ⽤来定义列表中的条⽬，有序⽆序都可以⽤-->5. 超链接标签<!--超链接标签<a> 内容体 </a>超链接正常⼯作：必有属性： href:要跳转到的地⽅内容体也不能少注意：1.a标签内容体，不仅仅可以是⽂字，也可以是其他内容，如图⽚2.a标签的href属性，不仅仅可以链接到html上，也可以链接到其他⽂件上，如图⽚-->6. 表格标签<!--表格标签<table> </table> 定义⼀个表格属性：border 表格边框粗细 width 表格宽度<tr> </tr> 定义表格的⾏<td> </td> 定义表中每⼀⾏中的单元格属性：colspan 可以理解为单元格所占的列数（默认为1）rowspan 可以理解为单元格所占的⾏数（默认为1）这两个属性常⽤于单元格合并，合并时注意删除合并前的单元格<th> </th> 定义表中每⼀⾏中的表头单元格（和<td></td>的区别就是单元格中的内容会加粗居中） -->7. 块标签<!--块标签<div> 内容体</div> 块级的块标签，默认占满⼀⾏，适⽤于⼤量数据展⽰<span> 内容体 </span> ⾏级的块标签，不会⾃动换⾏，适⽤于展⽰少量数据-->三、表单标签<!--表单标签<form> </form> 定义⼀个表单，之后和表单相关的操作要在此标签内属性：action:将数据提交到何处，默认是本页method：以何种⽅式提交数据，默认是getget：把数据拼接到地址栏，敏感信息不安全，数据容量有限post：没有把数据拼接到数据栏，请求体，相对安全，理论上数据容量⽆限表单标签：<input /> 表单输⼊标签之⼀，⽤户可以在该标签上，通过填写和选择，完成数据的输⼊type：设置该标签的种类text：⽂本框，默认password：密码，内容⾮明⽂radio：单选框，在同⼀组内有单选效果checkbox：复选框，在同⼀组内有复选效果submit：提交按钮，⽤于控制表单提交数据reset：重置按钮，⽤于将表单恢复到默认状态file：附件框，⽤于⽂件上传button：普通按钮，需要和JS事件⼀起⽤hidden：隐藏域，⼀般⽤作提交服务器数据，但⽆需⽤户看到的数据name：单选框、多选框的分组 / 设置该标签的对应的参数名某个表单输⼊需要通过参数列表时，必须设置name属性value：设置该标签对应的参数值 / 作为按钮的名字value属性的设置策略：1. ⽂本框密码框这样的表单输⼊，可以不强制指定value，因为⽤户可以⾃由输⼊。