Html基础

最新推荐文章于 2022-04-20 19:00:21 发布
最新推荐文章于 2022-04-20 19:00:21 发布
阅读量220 收藏 1
点赞数 1
分类专栏： html 文章标签： html基础
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_24832821/article/details/79334306
版权 
1·什么是 HTML？


    HTML： Hyper Text Markup Language ： 超文本标记语言

    超文本： 功能比普通文本更加强大

    标记语言： 使用一组标签对内容进行描述的语言， 它不是编程语言 

2· HTML 的语法和规范

    HTML 文件都是以.html 或者.htm 结尾的， 建议使用.html 结尾！
    Html 文件分为头部分<head></head>和体部分<body></body>。
    Html 标签都是由开始标签和结束标签组成(<hr />)。

    Html 标签忽略大小写， 建议使用小写。

3 HTML 入门

    3.1 HTML 文本标签

            a. 标题标签
                从<h1>到<h6>逐渐变小(加粗加黑显示)
            b. 水平线标签<hr/>
            c. 段落标签<p>

            d.字体标签
                <font 属性=值>内容</font>
                    color:设置字体的颜色， 可使用英文单词或者 16 进制
                    size：设置字体的大小， 从 1 到 7 逐渐变大，最大显示为 7
                    face：设置字体


               f.<img/>标签的 src 属性。
                    当前目录：直接写文件名称或者./文件名称
                    上一级目录： ../文件名称
                     下一级：目录名称/文件名称
                      width：设置图片的宽度
                      height： 设置图片的高度
                      alt： 当图片无法正常显示的时候给出的提示信息， 它的显示效果与浏览器有关

                g.列表标签：

                    有序列表： <ol type=”1” start=”4”><li></li></ol>

                h.无序列表： <ul type=”circle”><li></li></ul>

                i.超链接标签：
                    <a href=”http://www.baidu.com” target=”_self、 _blank”>百度</a>

                j. table表格标签：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>表格的跨行跨列操作</title>
	</head>
	<body>
		<table border="1px" width="500px" height="200px" align="center" cellspacing="0px" cellpadding="0px">
			<tr>
				<td colspan="2" align="center" width="250px" height="50px">
					<img src="../../img/1.jpg" height="100%" width="100%"/>
				</td>
				
				<td>13</td>
				<td>14</td>
			</tr>
			<tr>
				<td>21</td>
				<td colspan="2" rowspan="2" align="center">
					<table border="1px" align="center" width="100%" height="100%">
						<tr>
							<td>11</td>
							<td>12</td>
							<td>13</td>
						</tr>
						<tr>
							<td>21</td>
							<td>22</td>
							<td>23</td>
						</tr>
						<tr>
							<td>31</td>
							<td>32</td>
							<td>33</td>
						</tr>
					</table>
				</td>
				
				<td>24</td>
			</tr>
			<tr>
				<td>31</td>
				
				
				<td rowspan="2" align="center">34</td>
			</tr>
			<tr>
				<td>41</td>
				<td>42</td>
				<td>43</td>
				
			</tr>
			
		</table>
	</body>
</html>

            k.框架子标签<frame>

                                    后台系统显示页面.html

<html>
	<head>
		<meta charset="UTF-8">
		<title>后台系统显示页面</title>
	</head>
	<frameset rows="20%,*">
		<frame src="top.html" />
		<frameset cols="20%,*">
			<frame src="left.html" />
			<frame name="right" />
		</frameset>
	</frameset>
</html>
                                                     left.html                                
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<a href="right.html" target="right">会员管理</a><br /><br />
		<a href="#">品牌管理</a><br /><br />
		<a href="#">商品管理</a><br /><br />
		<a href="#">分类管理</a>
	</body>
</html>

                                    right.html

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		所有用户信息
	</body>
</html>

                                        top.html

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<font size="7">欢迎XXXX进入后台管理系统</font>
	</body>
</html>

                                        l.表单标签<form>


            method：表单提交的方式(get/post/delete……等 7 种)

  • 文本输入项
<input type=”text” name=”” size=”” maxlenght=”” readonly=””  placehoder=””/>

name: 提交到服务端必须指定的属性
size: 指定输入框的宽度
maxlenght: 指定输入内容的长度
readonly: 设置为只读
placehoder: 输入内容的提示信息

  • 密码输入项

<input type=”password” name=”” />

name: 提交到服务端必须指定的属性

  • 单选按钮

<input type=”radio” name=”” value=”” checked=””/>

value: 提交到服务端必须指定的属性

checked:默认选中,值为checked

  • 多选按钮

<input type=”checkbox” name=”” value=”” checked=”” />

  •  下拉列表

<select name=””>
    <option value=”” selected=””>北京</option>
    <option>上海</option>

</select>

value: 提交到服务端必须指定的属性

selected:默认选中,值为selected

  •  文件上传项

<input type=”file” name=””/>

  •  文本输入域

<textarea name=””></textarea>

  •  提交按钮

<input type=”submit” value=””/>

submit: 具备将整个表单提交到服务器的功能
value: 修改按钮上面的内容

  • 普通按钮

<input type=”button” value=””/>

  • 重置按钮

<input type=”reset” value=””/>

  •  隐藏项

<input type=”hidden” name=””/>
用于用户比较敏感的一些信息

  • Get 与 post 提交方式的区别？ 【默认提交方式为 get】

Get 提交方式，所有的内容显示在地址栏， 不够安全，长度有限制。
Post 提交方式，所有的内容不会显示在地址栏，比较安全，长度没有限制。













孤独的看着星星流泪
关注
  • 1
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
web前端之初级html-学习笔记二分享
weixin_52112965的博客
09-08 197
初级html学习二
HTML基础(CSDN)
ToDarryL的博客
08-06 1344
学习HTML的目标 目录 1.什么是网站跟网页 网站是指在因特网上根据一定的规则，使用HTML等制作的用于展示特定内容相关的网页集合 网页是网站中的一"页",通常是HTML格式的文件,他要通过浏览器来阅读 2.网页是构成网站的基本元素 网页是构成网站的基本元素,它通常由图片、链接、文字、声音、视频等元素组成。通常我们看到的网页,常见以.htm或.html后缀结尾的文件,因此将其俗称为HTML文件。 1.1什么是HTML HTML指的是超文本标记语言(Hyper Text Markup Lan
html基础
菜鸟一个
08-02 247
什么是HTML： HTML（HyperText Markup Language）超文本标记语言。 什么是超文本： 指页面内可以包含图片、链接，甚至音乐、程序等非文字元素。 html历史： HTML基本结构： 不区分大小写 不区分单双引号 DOCTYPE/title/meta： 我的第一个网页： 先建立一个空的txt文档， 然后插入下面代码： &lt;html&...
HTML基础
11-02
HTML基础 ppt
HTML基础知识
12-20
HTML前端网页设计的一些小知识，非常适合初学者学习，
HTML基础教程
小白_努力
05-09 1万+
1.一般我都是在记事本中写HTML文件，也有很多人用DreamWeaver，这个随意~~ 2.HTML的一般结构如下： ----以开始，以结束，表示之间的文档是HTML ----HTML文档的头部，主要放文档的标题信息 未使用CSS的HTML文件 ----HTML的主体部分  未使用CSS的HTML文件 ----在网页中插入一条水平线 未使用CSS的HTML文件
html 基础入门
丫头的博客
06-21 198
HTML的基础知识       1.HTML语言的遵循的规范      （1）一个HTML文件开始标签和结束标签            （2）HTML包含两部分内容                 设置相关信息             显示在页面上的内容都写在body里面           （3）HTML的标签有开始标签，也要有结束标签                
html基础入门
08-09
html入门基础 适合零基础或初学者，讲解详细，简洁明了
HTML基础一
玲珑骰子安红豆，入骨相思知不知
05-12 328
基本定义HTML：Hyper TextMarkup Language 超文本标签语言HTML：网页的“源码”浏览器：“解释和执行”HTML源码的工具查看网页一个基本的HTML页面所应该有的元素&lt;HTML&gt;&lt;HEAD&gt;&lt;TITLE&gt;我的第一个网页&lt;/TITLE&gt;&lt;/HEAD&gt;&lt;BODY&gt;    hello Word!&lt;/B...
html基础向
故事悠久if
11-10 147
html:结构标准 （主体，男生眼中–初始角色 女生眼中–素颜） css：表现标准 （男生–游戏装备，女生–化妆品） js：行为标准（男生–游戏技能，女生–加分特点）html：超文本标记语言< ! doctype html> 声明文档类型 <html> 根标签 <head> 头标签 <title></title> 标
全网最全HTML基础
a1085653724的博客
04-20 5031
1.HTML结构 认识 HTML 标签 ，HTML 代码是由 "标签" 构成的。 形如: <body>hello</body> (1).标签名(body)放到<>中. (2).大部分标签成对出现,<body>为开始标签,</body>为结束标签. (3).少数标签只有开始标签, 称为 "单标签". (4).开始标签和结束标签之间, 写的是标签的内容.(hello everyone) (5).开始标签中可能会带有 "属性". id
HTML零基础入门教程（详细）
ZONGXP的博客
10-22 21万+
HTML 是用来描述网页的一种语言。HTML 是一种在 Web 上使用的通用标记语言。HTML 允许你格式化文本，添加图片，创建链接、输入表单、框架和表格等等，并可将之存为文本文件，浏览器即可读取和显示。 HTML 指的是超文本标记语言:HyperTextMarkupL...
HTML入门与进阶以及HTML5
热门推荐
wuyxinu的博客
12-12 37万+
目录 一、简介 1、前端开发最核心技术 （1）HTML是什么？ （2）CSS （3）JavaScript 2、前端开发其他技术 二、基础内容 1.基础总结 2.HTML的基本标签 (1)HTML标签 (2)head标签 (3)body标签 3、段落与文字 (一)、段落标签 (二)、网页特殊符号 (三)、自闭合标签 (四)、块元素和行内元素 (五)、练...
HTML基础学习笔记
renkaigis的博客
08-21 1771
自学 html 基础笔记
HTML的一些基础知识（干货）(一）
DALE1186487104的博客
03-08 1万+
第一章.   页面基本元素1.1页面基础元素：&lt;html&gt;&lt;html&gt;是页面的基础元素，主要用来定义页面的开始和结束部分。元素语法结构如下&lt;html&gt;....&lt;/html&gt;（开头标记为&lt;&gt;,结束标记为&lt;/html&gt;）先介绍一下完整的HTML文件的基本结构&lt;html&gt;           文件开始标记&lt;

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值