标签:
开始标签: <html> 结束标签: <html>
这个标签是最顶层的标签,并且大部分的html标签,是开始和结束成对出现的
<head> </head> 用来存放html的一些属性信息,或者引用的外部资源(css,js,图片)
head一般不会影响到页面的界面显示.
<body> </body> 存放界面上要显示的内容
html中的标签有很多,不同的标签表示的意义也不同.(也有些标签本质上没啥区别)
<title>表示页面的标题
<body> </body> 用来表示需要显示的正文
<div> 默认独占一行(块级元素)
<spanp> 默认不独占一行(内联元素)
但是都可以借助CSS来修改,其他的html标签大多都可以归类到这两类中.
<a> 表示链接(link),一点击就能跳转到某个页面.
通过href属性告知要跳到哪里去~~
<p> 标签最初表示一个段落,但是p和div之间,实在没啥区别~(默认的样式不一样)
<image> 通过src属性来指定图片资源的地址.
如果一个页面中带有image标签,浏览器就会自动给服务器再次发起http请求来尝试获取资源.
<form> 表单. 是用户和服务器之间交互的一个重要途径.
表单里允许用户输入一些数据,借助表单能把数据提交到服务器上.
form method="get"action="http://www.sogou.com">
method表示构造的请求的方法是啥 action表示数据提交到哪个服务器上~
<input type="text"placeholder="请输入姓名"name="username">
<input type="text"placeholder="请输入密码"name="password">
form是把输入框中的数据以键值对的方式提交给指定服务器.
指定服务器的地址通过action字段来决定方法通过method字段决定
url中的参数的key就是input标签的name属性决定的.
url中的参数的value就是用户在输入框中输入的.
method改成post之后,浏览器通过form就是给服务器发送了post请求.
<html>
<head>
<title> 这是一个标题 </title>
<meta charset="UTF-8">
<head>
<body>
<image src="//i0.hdslb.com/bfs/archive/22650682fd25a4a5aa96dd9ef53190c6b8d54912.png"></image>
<div style = "margin-bottom: 10px"> 下午好 </div>
<div style = "margin-bottom: 10px"><a href="https://www.dogedoge.com/">点击搜索</a></div>
<form method="get" action="https://www.bilibili.com/">
<div style = "margin-bottom: 10px"><input type="text", placeholder="请输入姓名" name="uesename"></div>
<div style = "margin-bottom: 10px"><input type="password", placeholder="请输入密码" name="password"></div>
<div style = "margin-bottom: 10px"><input type="submit", value="提交"></div>
</form>
</body>
</html>
补充:
按f12开开发者工具
谷歌浏览器中的开发者工具:
看到的body的黄色的边,叫做margin,是body这个矩形的外边距.