新手小白HTML代码入门

最新推荐文章于 2023-09-05 13:58:01 发布

VIP文章 kirito_jack

最新推荐文章于 2023-09-05 13:58:01 发布

阅读量1.2k

点赞数

文章标签： html

本文链接：https://blog.csdn.net/kirito_jack/article/details/110749096

版权

新手小白HTML代码入门

前言

第一次写博客，希望能为刚入门的提供帮助

一、HTML是什么？

HTML全称Hyper Text Markup Language，中文名叫做超文本标记语言，主要作用是做数据展示

二、使用步骤

1.创建文件

用Sublime Text 3创建一个文件并保存为XXX.html，输入！，点击tab,就会出现如图的代码

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
	
</body>
</html>

接下来我们来解读一下这串代码中的各个标签什么意思

<!DOCTYPE html> 文件头---------页面响应的数据类型

<html lang="en">language(语言）--------表示页面所显示的语言类别

比较常用的有2种en—英文和zh-cn—中文

<head>------表示HTML的头的部分

<meta charset="UTF-8">---------表示你所输入的代码在那些国家可以使用

其中UTF-8------Unicode码为全世界的通用码
而

2.表单

form----表单

该标签一般不会单独使用会和input标签联合使用
属性：action=“url” url表示路径
路径分为绝对路径和相对路径
绝对路径：从盘符开始要表达的文件路径路径+文件名称
相对路径：当前源文件和目标文件的相对路径位置

file:///E:/code/2.html?kirito=kirito&pwd=123

?目标文件结束标识
&属性连接符

2.1请求方式

所谓的传输方式，简单举个例子。你在登陆一个网站的时候，当你在登录界面输入了你的账号和密码后就会跳出你的账号的个人中心，那么你的账号是如何被调用出来的呢？当你在输入自己的账号和密码并点击登录以后，它就会向数据中心发送请求。
而请求方式呢分为2种，一种为Get 请求，一种为Post请求
这两种请求虽说都能从数据中心种得到你的账号信息，但是安全性却是不一样的，Get 请求是不安全，而 Post请求是安全的。
Get 请求会使表单数据在页面地址栏中是可见的，如图在这里插入图片描述

Post请求就不会

2.2Target属性

3.Img标签表示页面上的图片

Src属性-----表示图片的替代文本

<img src="image/1.jpg" alt="美女" width="100%" height="100%">

Width 宽度
Height高度
该两个属性可以控制图片的大小单位可以使用XXpx 100%
Map —地图计算机语言映射

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>

	<img src="image/1.jpg" alt="美女" usemap="#one">

	<map id="one" name="one">
	  <area 
	  shape="circle"
	  coords="240,92,10"
	  href="https://www.baidu.com/" >
	  </area>

	</map>

</body>
</html>

4.表格布局

表格布局：通过表格来对网站进行整体的布局，这种布局目前来讲已经被淘汰了
主要使用的就是表格的标签
Table ----表格
Tr ----表行
Th ----表头
Td -----表元
示例：

<font color="purple"><table width="1600px">
	<tr>
	     <td>首页</td>
	     <td>玄幻小说</td>
	     <td>修真小说</td>
	     <td>都市小说

最低0.47元/天解锁文章

kirito_jack

关注

0
点赞
踩
9

收藏

觉得还不错? 一键收藏
1
评论
新手小白HTML代码入门

新手小白HTML代码入门前言第一次写博客，希望能为刚入门的提供帮助一、HTML是什么？ HTML全称Hyper Text Markup Language，中文名叫做超文本标记语言，主要作用是做数据展示二、使用步骤1.创建文件用Sublime Text 3创建一个文件并保存为XXX.html，输入！，点击tab,就会出现如图的代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8
复制链接

扫一扫