样例：
<!DOCTYPE html>
<html>
<!-- 头部 -->
<head>
<!-- 文本规格 -->
<meta charset="UTF-8">
<!-- 标题 -->
<title>这是我的第一个页面</title>
<!-- 样式 -->
<style>
<!-- 给所有img赋予样式 宽度 50px -->
img{width:50px}
<!-- 标签闭合 -->
</style>
</head>
<!-- 主体 -->
<body>
<h1>我的第一个页面</h1>
<p>这是我的第一个页面的第一个<a href="http://www.baidu.com">段落</a></p>
<h2>星巴克</h2>
<ul>
<li>咖啡</li>
<li>奶茶</li>
<li>牛奶</li>
<li>茶
<ul>
<li>红茶</li>
<li>绿茶</li>
</ul>
</li>
</ul>
<h3>浏览器</h3>
<img src="C:\Users\Public\Pictures\Sample Pictures\IE浏览器.png" alt="ie"/>
<img src="C:\Users\Public\Pictures\Sample Pictures\ios浏览器打开.png" alt="ios"/>
<img src="C:\Users\Public\Pictures\Sample Pictures\UC浏览器.png" alt="UC"/>
<img src="C:\Users\Public\Pictures\Sample Pictures\浏览器.png" alt="浏览器"/>
<script>
document.write('<p>这是我的第一个页面</p>');
</script>
</body>
</html>
<h1></h1> 标题
系统标签
h1 - h6
6级标签
<p></p>
换行标签
 
空格
<a></a> 全能标签
<a href="http://www.baidu.com"></a>
注意 所有html语言如果不用换行符 不会自动换行
显示图片
<img src="Desert.jpg">
src 后面链接的是项目的根目录的下级文件
在WebRoot 下建立一个图片文件夹 Images
alt 标签 用于搜索器采集图片内容标签
<img alt = "沙滩" src="Desert.jpg">
HTML元素
a p body html
HTML属性
h1 布局 居中布局
<h1 align="center"> 123456</h1>
<h1 align="center"> 123456</h1>
<h1 align="right"> 123456</h1>
<h1 align="left"> 123456</h1>
背景色彩
<body bgcolor = "bule">
style 样式
<a style ="background: yellow" >hello</a>
font-size 字体大小 之间用分号间隔
px 是像素大小
<a style ="background: yellow; font-size: 40px" >hello</a>
颜色采集器
RGB颜色查询表
十六进制 0-f
16进制 11 = 10进制的17
16进制 b= 10进制的11
16进制 22 = 2*16+2 = 34 （十进制）
可以用java写一个 算法
分割线
div 属性
<div style = "background: blue;text-align: center; width :50%;">
sdfsdfdsdsfsafsafsafsafasfsafsa
dsfsfdsfdsfs</div>
table 表格 需要使用style的话 外面需要加上 div标签
width 宽度标签
height 高度标签
border 框线 solid 实线
<div>
<table style="border: 1px solid red; width: 100%;height: 200px">
<tr >
<td>aa</td>
<td>bb</td>
</tr>
<tr>
<td>cc</td>
<td>dd</td>
</tr>
</table>
</div>
菜单
text-align:center; /设置水平居中/
vertical-align:middle;/设置垂直居中/
内容置顶
valign ="top";
padding-top 内边距
margin-top 上边距
cellspacing ="0px" table 标签内的边距
网友评论