html-基础标签

最新推荐文章于 2024-07-25 07:53:24 发布

xj-冲！

最新推荐文章于 2024-07-25 07:53:24 发布

阅读量919

点赞数

文章标签： html

本文链接：https://blog.csdn.net/qq_54962034/article/details/123870256

版权

HTML--超文本标记语言

在搭建一个网页的过程中，html决定页面显示什么内容。css决定页面的显示风格，美观程度。javaScript决定页面特效

一基本

一个html文件的内容应该被包含在<html></html>之间。

<html>
	<head>
		<title>这是网页标题</title>
		<meta charset="UTF-8">
	</head>
	<body>
		HEooooooo!!<br>
		你好
		<p>这里是第一个段落</p>
		<p>这里是第二个段落</p>
		<img src="D:\aWork\javaweb\html\imgs\test123.jpg" width='120' height="67" alt="这里是一张图片"/>
		<h1>标题一</h1>
		<h2>标题一</h2>
		<h3>标题一</h3>
		<h4>标题一</h4>
		<h5>标题一</h5>
		<h6>标题一</h6>
       </body>
</html>

正如以上代码展示，<h1></h1>之间包含标题，而且标题不能够超过六个，个级标题之间的大小与地位是不同的。

在头<head></head>中包含头部信息，其中可以指定网页标题和使用的编码集。

主体内容应该写在<body></body>中

<br/>代表换行 ,同时它是一个单标签,单表签一个在标签标志后加/

<p></p>段落之间的空隙要更大一些

<img src="路径"/> 放置图片

<img src="路径" width='120' height="67" /> 还能调整大小,图片的路径可以是绝对路径,也可以是相对路径,相对路径应从html文件存放的文件夹开始

alt="这里是一张图片" 放置在img标签内能够在图片无法显示是提示.

列表标签 ol

有序表
		<ol type="A" start="1">   type表示类型 A a I i 1   start表示从*开始
			<li>扫地僧</li>
			<li>萧远山</li>
			<li>乔峰</li>
		</ol>
无序表 
		<ul type="circle">
			<li>乔峰</li>
			<li>马夫人</li>
			<li>阿朱</li>
			<li>路人甲</li>
			<li>路人乙</li>
		</ul>

可以限制文字的形式

你是谁<b>快</b>告诉我<i>依依</i>还是<u>二二</u>  加粗 斜体 下划线

可以搜html实体获得那些实体符号的代码

比较符

     氧分子的化学式 O<sup>2</sup>
		5&lt;10  >
		10&gt;5  >=
		5&le;10  <=
		10&gr;5

<sup>和<sub>标签可以决定内容是上标还是下标

a 超链接

a 表式超链接
   href 链接地址
   target ：
               _self 在本窗口打开
               _blank 在新窗口打开
               _parent 在父窗口打开
               _top 在顶窗口打开

<a href="http://www.baidu.com" target="_blank">百度超链接</a>

二表格标签

table

tr 行
td 列
th 表头列

例如

<table border="1" width="600" cellspacing="0" cellpadding="4">
			<tr align="center">
				<th>姓名</th>
				<th>门派</th>
				<th>绝技</th>
			</tr>
			<tr align="center">
				<td>乔峰</td>
				<td>丐帮</td>
				<td>降龙十八掌</td>
			</tr>
			<tr align="center">
				<td>虚竹</td>
				<td>不知道</td>
				<td>逍遥步</td>
			</tr>
			<tr align="center">
				<td>路人甲</td>
				<td>少林</td>
				<td>金钟罩</td>
			</tr>




		</table>

或者也可以像这样

rowspan: 行合并
colspan：列合并

		<table border="1" width="600" cellspacing="0" cellpadding="4">
			<tr align="center">
				<th>名称</th>
				<th>单价</th>
				<th>数量</th>
				<th>小计</th>
				<th>操作</th>
			</tr>
			<tr align="center">
				<td>苹果</td>
				<td>5</td>
				<td>20</td>
				<td>100</td>
				<td><img src="D:\aWork\javaweb\html\imgs\test2.jpg" width="25" height="25"></td>
			</tr>
			<tr align="center">
				<td>菠萝</td>
				<td>7</td>
				<td>50</td>
				<td>350</td>
				<td><img src="D:\aWork\javaweb\html\imgs\test2.jpg" width="25" height="25"></td>
			</tr>
			<tr align="center">
				<td>西瓜</td>
				<td>4</td>
				<td>40</td>
				<td>160</td>
				<td><img src="D:\aWork\javaweb\html\imgs\test2.jpg" width="25" height="25"></td>
			</tr>
			<tr align="center">
				<td>总计</td>
				<td colspan="4">181</td>
			</tr>


		</table>

三表单标签

<html>
	<head>
		<title>表单标签的学习</title>
		<meta charset="UTF-8">
	</head>
	<body>
		<form action="demo4.html" method="post">
			昵称:<input type="text" name="nickName" value="输入昵称" /><br/>
			密码:<input type="password" name="pwd" /><br/>
			性别:<input type="radio" name="gender" value="male" />男
				<input type="radio" name="gender" value="female" />女 <br/>
			爱好:<input type="checkbox" name="hobby" value="basketball"/>篮球
				<input type="checkbox" name="hobby" value="football" checked />足球
				<input type="checkbox" name="hobby" value="earth"/>地球<br/>
			生肖:<select name="start">
					<option value="1">鼠</option>
					<option value="2">牛</option>
					<option value="3">虎</option>
					<option value="4">兔</option>
					<option value="5" selected>龙</option>
				</select><br/>
			备注:<textarea name="beizhu" rows="4" cols="50"></textarea><br/>
			<input type="submit" value="注册"/>
			<input type="reset" value="重置"/>
			<input type="button" value="这是一个普通按钮"/>


			
		</form>
		


	</body>
</html>

input name 属性必须指定否则文本框的数据不会发送给数据
input radio类型的name应该要一样才会由互斥的效果
input password 密码框
input checkbox 复选框

还有一些不再使用的html功能
frameset
iframe

html解释型的标记语言不区分大小写

总结

浅了解一下，有一个认识，能在后面的学习中，看到html可以有一定的整体把握

xj-冲！

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
html-基础标签

HTML--超文本标记语言在搭建一个网页的过程中，html决定页面显示什么内容。css决定页面的显示风格，美观程度。javaScript决定页面特效一基本一个html文件的内容应该被包含在<html></html>之间。<html> <head> <title>这是网页标题</title> <meta charset="UTF-8"> </head> <body>
复制链接

扫一扫