目录
1.标题排版
2.标题样式
3.正文排版
4.页面布局
5.表格、表单标签
1.标题排版
图片标签：<img>，src：指定图像的url(绝对路径/相对路径)
width：图像的宽度(像素/相对于父元素的百分比)
height：图像的高度(像素 / 相对于父元素的百分比)
标题标签：<h1> - <h6>，只有6个
水平线标签：<hr>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>焦点访谈：中国底气 新思想夯实大国粮仓</title>
</head>
<body>
<!-- 绝对/相对磁盘路径 -->
<!-- <img src="E:\\JavaWeb\html\新浪新闻.jpg"> -->
<!-- 绝对网络路径 -->
<img src="https://i2.sinaimg.cn/dy/deco/2012/0613/yocc20120613img01/news_logo.png", width="100px"> 新浪政务 > 正文
<img src="./01.新浪新闻-标题排版.html">
</body>
</html>2.标题样式
CSS三种引入方式：
- 行内样式：写在标签的style属性中(不推荐)
- 内嵌样式：写在style标签中(可以写在页面任何位置，但通常约定写在head标签中)
- 外联样式：写在一个单独的.css文件中(需要通过link标签在网页中引入)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>焦点访谈：中国底气</title>
</head>
<!-- CSS三种引入方式：行内、内嵌、外联（单独.css文件） -->
<!-- 内嵌样式 -->
<style>
h2{
color: rgb(0, 0, 256);
}
h3{
color: aqua;
}
</style>
<!-- 外联样式 -->
<link rel="stylesheet" href="css/news.css">
<body>
<img src="https://i2.sinaimg.cn/dy/deco/2012/0613/yocc20120613img01/news_logo.png", width="100"> 新浪政务 > 正文
<!-- 行内样式 -->
<h1 style="color: black;">中国底气</h1>
<h2>大国样貌</h2>
<h3>国家本色</h3>
<hr>
2024年8月6日
<hr>
</body>
</html>span标签包裹单独行
<body>
<hr>
<span>2024年8月6日</span> <span>央视网</span>
<hr>
</body>
</html>
超链接标签:
<a href="..." target="...">央视网</a>
属性：href：指定资源访问的url
target：指定在何处打开资源链接，_self：默认值，在当前页面打开，_blank：在空白页面打开
3.正文排版
4.页面布局
5.表格、表单标签
<body>
<!-- form表单属性：
action：表单提交的url，往何处提交，如果不指定则默认提交到当前页面
method：表单提交方式
-->
<form action="" method="get">
用户名：<input type="text" name="username">
密码：<input type="text" name="password">
<input type="submit" value="提交">
</form>
</body>method的默认值为get：在url后面拼接表单数据，比如：?username=Tom&age=12，但是这种方式提交大小有限制，所以如果是提交比较大的数据就很难用get实现
post：表单数据在请求体中携带，大小没有限制
