javaWeb技术第一篇之HTML
<!-- 当前是最简的html -->
<html>
<!-- 告诉浏览器当前是一个html文档
最外面的标签。 -->
<head>
<!--head头标签:用来设置网页的参数 -->
<!--title告诉浏览器展示网页标题-->
<title>百度百科</title>
<!--meta标签:用来设置网页编码
charset="utf-8":utf-8 防止中文乱码 -->
<meta charset="utf-8"/>
</head>
<body>
<!-- body主体标签:用来显示网页内容-->
Hello world! 我爱你中国
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<!--
h1~6 是告诉浏览器展示标题。
格式
<h1>标题</h1>
效果:
级数越大字体越小。
-->
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<!--font字体标签:告诉浏览器按照指定的颜色 大小 字体效果展示文字
格式:
<font color="设置颜色" size="设置大小" face="设置字体">
文字
</font>
* color可以使用单词来设置颜色，也可以使用16进制来设置颜色，项目中一般使用取色器
* size取值 1~7
* face使用中文提示
-->
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<!--i标签：告诉浏览器把文字倾斜
格式:
<i>我是倾斜</i>
b标签:告诉浏览器把文字加粗
格式:
<b>我是加粗</b>
strong标签:告诉浏览器把文字加粗
格式
<strong>我是加粗</strong>
-->
<!--加粗带有倾斜-->
<i><b>我是加粗加倾斜</b></i>
<i><strong>我是加粗加倾斜</strong></i>
<strong><i>我是加粗加倾斜</i></strong>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<!--
排版:设置文字的排列顺序
意义：提高阅读体验
1. 空格:告诉浏览器隔开内容
2.<br/>换行:告诉浏览器该标签右边的内容另起一行，没有留白
3.分段:将文字设置成段落,留白 <p>文字 内容</p>
4.<hr width="设置宽度 百分比/像素px" align="设置对齐方向"/>分割线：告诉浏览器展示一条线
*p标签有留白 br标签没有留白
-->
宋<hr width="50px" align="right"/>jj马蓉 王<br/>宝强
<p>故事1</p>
<p>故事2</p>
<p>故事3</p>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<!--
1)联想
2)列点
*公司简介 使用h1标签
* 分割线使用hr标签
* “训练营” 使用font标签
* CSDN 使用i+b或者 i+strong
* 使用p标签 创建四个段落
3)编码-->
<!--*公司简介 使用h1标签-->
<h1>公司简介</h1>
<!--* 分割线使用hr标签-->
<hr/>
<!--* “训练营” 使用font标签-->
<!--* 使用b/strong-->
<!--* 使用i-->
<!--* CSDN 使用i+b或者 i+strong-->
<p>
<font color="red">“训练营”</font>是由<b></b>联合<i>中关村软件园</i>、<i><b>CSDN</b></i>
</p>
<!--* 使用p标签 创建四个段落-->
<p>
</p>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<!--img标签：告诉浏览器展示一个图片文件
<img src="设置好路径" width="设置宽度" height="设置高度" alt="设置图片找不到的提示文字 "/>
*相对路径:项目内部使用相对路径。 ./当前目录
*绝对路径: http://...
* D:\用户目录\我的文档\HBuilderProjects\dayHtmlCode\img\zhaoliyin.jpg
-->
<img src="./img/zhaoliyin.jpg" width="100px" height="200px"/><br/>
<img src="http://localhost:8080/tomcat.png" /></br/>
<img src="./img/zhaoliyin.jpg" width="100px" height="200px" alt="这是一张黄图"/><br/>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<!--a标签：告诉浏览器当用户点击文字 时，打开隐藏的资源(图片 网页)
<a href="设置资源路径">文字</a>
-->
<a href="./img/huangtu.jpg">这是一张黄图</a><br/>
<a href="./index.html">这是一张黄页</a><br/>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<!--一条记录一行地展示就叫列表
<ul type="设置符号 实习圆disc 空心圆circle 方块square"> 无序表:顺序对记录的价值没有影响 unorder list
<li>记录1</li> list item
<li>记录2</li> list item
</ul>
<ol type="设置符号 有顺序 ">有序表:顺序对记录的价值有极大影响 order list
<li>记录1</li> list item
<li>记录2</li> list item
</ol>
* 1代表自然数
* a小写字母
* A大写字母
* i 罗马字母
* I 大写逻辑字母
-->
你喜欢的四大名著有哪些？
<ul type="disc">
<li>金pin梅</li>
<li>哈利波特</li>
<li>指环王</li>
<li>诛仙</li>
</ul>
你喜欢的几个老师?
<ol type="I">
<li>泷老师</li>
<li>大桥老师</li>
<li>苍老师</li>
<li>波老师</li>
<li>泷老师</li>
</ol>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<!--*使用ul表示一个列表
*使用li表示一条记录
*使用a表示一个超链接
*使用font设置颜色 -->
<ul>
<li><a href="#"><font face="黑体" color="#39619C">主持深改组第35次会议治国理政砥砺奋进</font></a></li>
<li><a href="#">就曼彻斯特爆炸事件向英国女王致慰问电</a></li>
<li><a href="#"><font face="黑体" color="#39619C">总理力挺“互联网+”：中国数字经济已是全球先驱</font></a></li>
<li><a href="#">张高丽出席第40届南极条约协商会议开幕式并致辞</a></li>
<li><a href="#">张高丽出席第40届南极条约协商会议开幕式并致辞</a></li>
<li><a href="#">张高丽出席第40届南极条约协商会议开幕式并致辞</a></li>
</ul>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<!--
列表：一列多行
表格:多列多行
表格看成列表的扩展
table标签:告诉浏览器展示一个表格
<table order="1px 设置边框" width="50% 设置宽度"></table>
tr标签:告诉浏览器展示一个表格行
tr必须包含在table内
td标签:告诉浏览器展示一个单元素
td必须包含在tr内
th与td都是单元格,前者对内容进行居中加粗
数据必须被td包含
理解:table就是一个死脑筋。认为数据必须被td包含，其它情况显示在列表。
-->
<table border="1px" width="50%">
<tr>
<td>1</td><td>2</td><td>3</td>
</tr>
<tr>
<td>1</td><td>2</td><td>3</td>
</tr>
</table>
<table border="1px" width="100%">
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
</table>
扩展:合并单元格
*span范围
rowspan
colspan
<table border="1px" width="100%">
<tr>
<!--*1.删除合并单元格
*2.创建新单元格
*3.设置colspan跨列合并1+n
bgcolor="设置背景颜色"
-->
<td colspan="2" bgcolor="gray" align="right"><b>1 2</b></td>
<td>3</td>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
</table>
跨行合并:合并的单元格涉及多个行，相邻
<table border="1px" width="100%">
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
<tr>
<!--
*删除需要合并的单元格
*新建新的单元格
*设置rowspan=1+n-->
<td rowspan="2" bgcolor="gray">1 1</td>
<td>2</td>
<td>3</td>
</tr>
<tr>
<td>2</td>
<td>3</td>
</tr>
</table>
<!--商城的热门商品结构-->
<table border="1px" width="100%">
<tr>
<td colspan="7" bgcolor="gray">热门商品</td>
</tr>
<tr>
<td rowspan="2" bgcolor="yellow">大图</td>
<td colspan="3" bgcolor="blue">大图</td>
<td>5</td>
<td>6</td>
<td>7</td>
</tr>
<tr>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
<td>6</td>
<td>7</td>
</tr>
</table>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<!--
1）联想
2）列点
*使用表格table展示6行
*第一行 两个img 三个 a标签
*第二行 背景bgColor为黑的 行 文字为白色
*第三个 大的img
*第四个 热门商品 跨行跨列
*第五个 img
*第六个 5个a标签 p完成分段居中
3) 编码
-->
<!--*使用表格table展示6行-->
<table border="1px" width="100%">
<tr>
<td>
<!--*第一行 两个img 三个 a标签-->
<table width="100%">
<tr>
<td><img src="img/logo2.png"/></td>
<td><img src="img/header.jpg"/></td>
<td><a href="#">登录</a> <a href="#">注册</a> <a href="#">关于</a></td>
</tr>
</table>
</td>
</tr>
<tr bgcolor="black" height="40px">
<td>
<!--*第二行 背景bgColor为黑的 行 文字为白色-->
<font color="white" size="4">电脑</font>
<font color="white" size="4">手机</font>
</td>
</tr>
<tr>
<td>
<!--*第三个 大的img-->
<img src="img/1.jpg" width="100%"/>
</td>
</tr>
<tr>
<td>
<!--*第四个 热门商品 跨行跨列
td内部是可以再包含表格的。
但是写的时候要小心
-->
<table width="100%" border="0px">
<tr>
<td colspan="7">
<h3>热门商品 <img src="img/title2.jpg" /></h3>
</td>
</tr>
<tr height="240px">
<td rowspan="2">
<img src="img/big01.jpg" />
</td>
<td colspan="3">
<img src="img/middle01.jpg" width="100%" height="96%"/>
</td>
<td width="14.2%">
<p align="center"><img src="img/small08.jpg"/></p>
<p align="center">妹子</p>
<p align="center"><font color="red">$200</font></p>
</td>
<td width="14.2%">
<p align="center"><img src="img/small08.jpg"/></p>
<p align="center">妹子</p>
<p align="center"><font color="red">$200</font></p>
</td>
<td width="14.2%">
<p align="center"><img src="img/small08.jpg"/></p>
<p align="center">妹子</p>
<p align="center"><font color="red">$200</font></p>
</td>
</tr>
<tr height="240px">
<td width="14.2%">
<p align="center"><img src="img/small08.jpg"/></p>
<p align="center">妹子</p>
<p align="center"><font color="red">$200</font></p>
</td>
<td width="14.2%">
<p align="center"><img src="img/small08.jpg"/></p>
<p align="center">妹子</p>
<p align="center"><font color="red">$200</font></p>
</td>
<td width="14.2%">
<p align="center"><img src="img/small08.jpg"/></p>
<p align="center">妹子</p>
<p align="center"><font color="red">$200</font></p>
</td>
<td width="14.2%">
<p align="center"><img src="img/small08.jpg"/></p>
<p align="center">妹子</p>
<p align="center"><font color="red">$200</font></p>
</td>
<td width="14.2%">
<p align="center"><img src="img/small08.jpg"/></p>
<p align="center">妹子</p>
<p align="center"><font color="red">$200</font></p>
</td>
<td width="14.2%">
<p align="center"><img src="img/small08.jpg"/></p>
<p align="center">妹子</p>
<p align="center"><font color="red">$200</font></p>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<!--*第五个 img-->
<img src="img/ad.jpg" width="100%"/>
</td>
</tr>
<tr>
<td>
<!--*第六个 5个a标签 p完成分段居中-->
<p align="center">
<a href="#">友情连接</a>
<a href="#">友情连接</a>
<a href="#">友情连接</a>
<a href="#">友情连接</a>
<a href="#">友情连接</a>
</p>
<p align="center">Copyright © 2005-2016 传智商城 版权所有</p>
</td>
</tr>
</table>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<!--frame是代表浏览器界面的一个小窗口
可以加载html页面
格式
<frame src="设置html页面路径"/>
frameset是小窗口的集合
*可以包含多个小窗口
*但是不能跟body一块使用，要不就失效
* 可以在frameset里面使用cols属性:依次设置小窗口的宽度。值使用,隔开 cols="30%,30%,40%"
* 最后一个值也可使用*代替
* 使用rows属性:依次设置小窗口的高度。值使用,隔开 rows="30%,30%,40%"
-->
<!--<frameset cols="30%,30%,*">
<frame src="001.最简html.html"/>
<frame src="002.文字元素-标题.html"/>
<frame src="003.文字元素-字体.html"/>
</frameset>-->
<frameset rows="20%,60%,*">
<frame src="001.最简html.html"/>
<frame src="002.文字元素-标题.html"/>
<frame src="003.文字元素-字体.html"/>
</frameset>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<frameset rows="20%,*,20%">
<frame src="html/head.html" />
<!--<frame src="html/rygl.html" />-->
<frameset cols="20%,*">
<frame src="html/left.html"/>
<!--这里不设置展示页面，页面内容由链接给定
name相当于给frame设置了一个id
-->
<frame name="detail"/>
</frameset>
<frame src="html/foot.html" />
</frameset>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<!--
表单是什么？
一个网页的单子。
表单作用？
收集不同用户的输入数据
应用场景:注册/登录，银行-表单。
格式:
<form>
输入元素
</form>
告诉浏览器当前需要显示一个表单。
*表单是一个集合.
* 内部可以添加输入元素
输入元素:
*input 输入标签
* select 下拉列表标签
* textarea文本域
* button(了解)
-->
<form>
账号:<input />
</form>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<!--
输入元素:所有输入元素必须被包含在form标签内
*input 输入标签
*属性type：设置输入元素的外观
*属性value：提交给服务器的数据/设置按钮的显示文字
* text:设置文本框 默认
* password：提高安全性，密码显示
* radio:单选效果,一组选项选一个
* checkbox:复选效果,一组里面选多个
* submit提交数据到服务器
* 属性name:可以给单选/复选 分组。
* 属性checked:选中 标准 ：checked="checked" 变态:checked或者checked="" 加上这个表示直接选中一个选项,一进入页面性别男就被选中
* select 下拉列表标签
* textarea文本域
* button(了解)
-->
<form>
账号:<input type="text"/>
<br/>密码:<input type="password" />
<br/>确认密码:<input type="password" />
<br />性别<input type="radio" name="sex" checked="checked" value="0"/>男<input type="radio" name="sex" value="1"/>女
<br />追女孩不正确办法：<input type="checkbox" name="method" checked="checked" value="0"/>送礼物
<input type="checkbox" name="method" checked="checked" value="1"/>太关心
<input type="checkbox" name="method" checked="checked" value="2"/>call/sms
<br /> <input type="submit" value="注册" />
</form>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<!--
输入元素:所有输入元素必须被包含在form标签内
*input 输入标签
*属性type：设置输入元素的外观
*属性value：提交给服务器的数据/设置按钮的显示文字
* text:设置文本框 默认
* password：提高安全性，密码显示
* radio:单选效果,一组选项选一个
* checkbox:复选效果,一组里面选多个
* submit提交数据到服务器
*
* 了解:
* file:选择文件
* date:日期
* button:显示一个按钮
* image:显示一个图片按钮 可以使用src设置图片文件
* reset:重置.
* hidden:隐藏,一般是后续程序使用，隐藏是不想让用户去编辑
* 属性name:可以给单选/复选 分组/只要提交给服务端的数据都必须加上name作变量名
* 属性checked:选中 标准 ：checked="checked" 变态:checked或者checked=""
* 属性readonly="readonly" 取消编辑功能
* 属性disabled="disabled" 取消编码功能，显示灰色
*
* size="60":设置显示宽度
* maxlength:设置最大输入字符
* select 下拉列表标签
* textarea文本域
* button(了解)
-->
<form>
<input type="hidden" name="id" value="123" />
<br/>账号:<input type="text" name="username"size="60" maxlength="30"/>
<br/>密码:<input type="password" name="pwd"/>
<br/>确认密码:<input type="password" value="123" disabled="disabled" name="pwd2"/>
<br />性别<input type="radio" name="sex" checked="checked" value="0"/>男<input type="radio" name="sex" value="1"/>女
<br />追女孩不正确办法：<input type="checkbox" name="method" checked="checked" value="0"/>送礼物
<input type="checkbox" name="method" checked="checked" value="1"/>太关心
<input type="checkbox" name="method" checked="checked" value="2"/>call/sms
<br /> <input type="file" name="head" />
<br />生日:<input type="date" name="birthday" value="2014-01-02" readonly="readonly"/>
<br /><input type="button" value="我是按钮" /> <input type="image" src="img/015.jpg" width="60" height="30" />
<br /> <input type="submit" value="注册" /> <input type="reset" value="我是重置" />
</form>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<!--
输入元素:所有输入元素必须被包含在form标签内
*input 输入标签
*属性type：设置输入元素的外观
*属性value：提交给服务器的数据/设置按钮的显示文字
* text:设置文本框 默认
* password：提高安全性，密码显示
* radio:单选效果,一组选项选一个
* checkbox:复选效果,一组里面选多个
* submit提交数据到服务器
*
* 了解:
* file:选择文件
* date:日期
* button:显示一个按钮
* image:显示一个图片按钮 可以使用src设置图片文件
* reset:重置.
* hidden:隐藏,一般是后续程序使用，隐藏是不想让用户去编辑
* 属性name:可以给单选/复选 分组/只要提交给服务端的数据都必须加上name作变量名
* 属性checked:选中 标准 ：checked="checked" 变态:checked或者checked=""
* 属性readonly="readonly" 取消编辑功能
* 属性disabled="disabled" 取消编码功能，显示灰色
* size="60":设置显示宽度
* maxlength:设置最大输入字符
* select 下拉列表标签
* textarea文本域
* button(了解)
*
*
* 表单属性
* action:设置提交给服务端的地址。当前使用#
* method:设置提交方法
* 1)get，默认值.
* 特点:提交参数会显示在地址栏上面
* ?id=123&username=122&pwd=222&sex=0&method=0&method=1&method=2&head=&birthday=2014-01-02#
* 使用&连接多个参数
* 第一个参数前加?
* 每个参数都有k=v
* 有数据限制.
* 2)post
* 提交的数据不显示地址栏,安全性高
* 提交文件。
* 如果项目中提交文件,不允许显示参数在地址栏上，一般使用post
-->
<form action="#" method="post">
<input type="hidden" name="id" value="123" />
<br/>账号:<input type="text" name="username"size="60" maxlength="30"/>
<br/>密码:<input type="password" name="pwd"/>
<br/>确认密码:<input type="password" value="123" disabled="disabled" name="pwd2"/>
<br />性别<input type="radio" name="sex" checked="checked" value="0"/>男<input type="radio" name="sex" value="1"/>女
<br />追女孩不正确办法：
<input type="checkbox" name="method" checked="checked" value="0"/>送礼物
<input type="checkbox" name="method" checked="checked" value="1"/>太关心
<input type="checkbox" name="method" checked="checked" value="2"/>call/sms
<br /> <input type="file" name="head" />
<br />生日:<input type="date" name="birthday" value="2014-01-02" readonly="readonly"/>
<br /><input type="button" value="我是按钮" /> <input type="image" src="img/015.jpg" width="60" height="30" />
<br /> <input type="submit" value="注册" /> <input type="reset" value="我是重置" />
</form>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<!--
textarea标签：告诉浏览器显示一个多行的输入框
格式:
<textarea rows="设置高度" cols="设置宽度">
内容
</textarea>
下拉列表:select标签告诉浏览器显示一个下拉列表
作用:单选或者多选(类似ul/ol)
格式:
<select >
<option>记录1</option>
<option>记录2</option>
<option>记录3</option>
</select>
属性:multiple 设置多选multiple="multiple"
size:设置显示项数
应用场景:省 市 学历
-->
<form action="#" method="post">
今晚想翻谁?
<br />
<select name="onenight" multiple="multiple" size="9" >
<option value="0" >班长</option>
<option value="1">詹老师</option>
<option value="2">王老师</option>
<option value="3">波老师</option>
</select>
<br />
<textarea name="desc" rows="20" cols="60">我是小海贼</textarea>
<br />
<input type="submit" value="发表" />
</form>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<!--
联想
列点
*表单:集合
*表单元素
*使用table标签
*text
*password
*date
*radio
*image
*submit
* placeholder占位符
编码
-->
<!-- *表单:集合-->
<form action="#" method="post">
<!--*表单元素-->
<!--*使用table标签-->
<table width="50%" border="0px">
<tr>
<td align="right">
<font color="blue">会员注册</font>
</td>
<td align="left" colspan="2">USER REGISTER</td>
</tr>
<!--*text-->
<tr>
<td align="right"><b>用户名</b></font>
</td>
<td align="left" colspan="2"><input type="text" name="username" size="50" placeholder="用户名"/></td>
</tr>
<!--*password-->
<tr>
<td align="right"><b>密码</b></font>
</td>
<td align="left" colspan="2"><input type="password" name="password" size="50" /></td>
</tr>
<tr>
<td align="right"><b>确认密码</b></font>
</td>
<td align="left" colspan="2"><input type="password" name="password2" size="50" /></td>
</tr>
<tr>
<td align="right"><b>Email</b></font>
</td>
<td align="left" colspan="2"><input type="text" name="email" size="50" /></td>
</tr>
<tr>
<td align="right"><b>姓名</b></font>
</td>
<td align="left" colspan="2"><input type="text" name="uname" size="50" /></td>
</tr>
<!--*radio-->
<tr>
<td align="right"><b>性别</b></font>
</td>
<td align="left" colspan="2"><input type="radio" name="sex" checked="checked" />男<input type="radio" name="sex" />女</td>
</tr>
<!--*date-->
<tr>
<td align="right"><b>出生日期</b></font>
</td>
<td align="left" colspan="2"><input type="date" name="birthday" /></td>
</tr>
<!--*image-->
<tr>
<td align="right"><b>验证码</b></font>
</td>
<td align="left" width="33%"><input type="text" name="code" width="100" /></td>
<td align="left" width="33%"><input type="image" src="img/015.jpg" width="60" height="40" /></td>
</tr>
<!--*submit-->
<tr>
<td colspan="3" align="center">
<input type="submit" value="注册" width="200px" />
</td>
</tr>
</table>
</form>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<!--
div:块级元素,设置区域
独占一行
格式
<div>
元素
</div>
span:内联元素/行内元素,设置区域
不独占一行
格式
<span>
元素
</span>
应用场景 ：特别多，几乎每个页面都要大量使用
-->
<div style="">
我是div
</div>
<div style="">
我是div
</div>
<span style="">
我是span
</span>
<span style="">
我是span
</span>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<link rel="stylesheet" type="text/css" href="css/out.css"/>
</head>
<body>
javaWeb技术第一篇之HTML的更多相关文章
- android apk 防止反编译技术第一篇-加壳技术
做android framework方面的工作将近三年的时间了,现在公司让做一下android apk安全方面的研究,于是最近就在网上找大量的资料来学习.现在将最近学习成果做一下整理总结.学习的这些成 ...
- javaWeb技术第二篇之CSS、事件和案例
<!--内联式 CSS (层叠样式表) 编辑 层叠样式表(英文全称:Cascading Style Sheets) CSS不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式 ...
- javaweb回顾第一篇servlet的学习和理解
前言:关于servlet相信学过java的都不会陌生,我最近又把这些基础知识整理一遍,便于自已能更好的理解ssm或者ssh,下面开始 1:Servlet接口 servlet有5个方法下面分别简单的介绍 ...
- 开博客这么久以来，第一篇技术文章，python与c的接口对接
在博客园开博客已经有了蛮长时间了,但是从来只是看别人的文章,自己却从未写过一篇技术文章,深表惭愧.内心还是希望能够给大家提供一些帮助的,希望这第一篇技术博客,能够给大家一些帮助.闲话少叙,开始正文. ...
- iOS开发——高级技术精选&底层开发之越狱开发第一篇
底层开发之越狱开发第一篇 做越狱开发也有一些时间了,有很多东西想总结一下,希望给他人一些借鉴,也是自己对过去开发经历的一些总结.个人不推荐使用盗版,这里主要以技术介绍为主. 这个系列里面主要介绍怎样进 ...
- Java Nested Classes(内部类~第一篇英文技术文档翻译)
鄙人最近尝试着翻译了自己的第一篇英文技术文档.Java Nested Classes Reference From Oracle Documentation 目录 嵌套类-Nested Classes ...
- Java图像处理最快技术：ImageJ 学习第一篇
ImageJ是世界上最快的纯Java的图像处理程序. 它能够过滤一个2048x2048的图像在0.1秒内(*). 这是每秒40万像素!ImageJ的扩展通过使用内置的文本编辑器和Java编译器的Ima ...
- 深入理解JavaWeb技术内幕（一）
最近在看许令波的<深入理解JavaWeb技术内幕>.整理了一些笔记.想做一个系列,这篇是系列的第一篇,讲Web请求. B/S架构 最常见的架构方式. 优点: 1.客户端使用统一(此处的统一 ...
- 走进JavaWeb技术世界1：JavaWeb的由来和基础知识
本系列文章将整理到我在GitHub上的<Java面试指南>仓库,更多精彩内容请到我的仓库里查看 https://github.com/h2pl/Java-Tutorial 喜欢的话麻烦点下 ...
随机推荐
- 安装react-native-cli工具（三）
设置淘宝镜像 (这一步可以省略) npm config set registry https://registry.npm.taobao.org --global npm config set dis ...
- linux（center OS7）安装JDK、tomcat、mysql 搭建java web项目运行环境
一.安装JDK 1.卸载旧版本或者系统自带的JDK (1)列出所有已安装的JDK rpm -qa | grep jdk (2)卸载不需要的JDK yum -y remove 安装包名称 2.下载并解压 ...
- QForkMasterInit: system error caught. error code=0x000005af, message=VirtualAllocEx failed.（遇到还没试过）
今天在使用Redis的时候出现以下错误: QForkMasterInit: system error caught. error code=0x000005af, message=VirtualAll ...
- IT兄弟连 HTML5教程 CSS3属性特效 transition过渡
CSS3的transition允许css的属性值在一定的时间区间内平滑地过渡.这种效果可以在鼠标单击.获得焦点.被点击或对元素任何改变中触发,并圆滑地以动画效果改变CSS的属性值. transitio ...
- Cross-Site Scripting:Persistent 跨站点脚本：持久性
- 东芝MCU实现位带操作
位带操作简介 位带操作的概念其实30年前就有了,那还是 8051单片机开创的先河,如今ARM CM3 将此能力进化,可以说,这里的位带操作是8051 位寻址区的威力大幅加强版.即如果要改写某个寄存器的 ...
- 基于canvas二次贝塞尔曲线绘制鲜花
canvas中二次贝塞尔曲线参数说明: cp1x:控制点1横坐标 cp1y:控制点1纵坐标 x: 结束点1横坐标 y:结束点1纵坐标 cp2x:控制点2横坐标 cp2y:控制点2纵坐标 z:结束点2横 ...
- Python中通过csv的writerow输出的内容有多余的空行两种方法
第一种方法 如下生成的csv文件会有多个空行 import csv #python2可以用file替代open with open("test.csv","w" ...
- 剑指offer笔记面试题8----二叉树的下一个节点
题目:给定一棵二叉树和其中的一个节点,如何找出中序遍历序列的下一个节点?树中的节点除了有两个分别指向左.右子节点的指针,还有一个指向父节点的指针. 测试用例: 普通二叉树(完全二叉树,不完全二叉树). ...
- Python3如何安装pip工具？
前几天安装Python的时候没有装上pip工具,所以只能现在手动安装了. 首先,访问https://bootstrap.pypa.io/get-pip.py这个网址,然后Ctrl+S将get-pip. ...