学习HTML第一天总结

最新推荐文章于 2022-07-28 00:33:39 发布

棪小木

最新推荐文章于 2022-07-28 00:33:39 发布

阅读量122

点赞数 2

文章标签： html

本文链接：https://blog.csdn.net/qq_55931044/article/details/120422619

版权

什么是HTML?

HTML：是Hyper Text Markup Language的缩写，意思是超文本标记语言；

文本：文字；

超文本：指网页中所显示的超链接、图片、视频等；

标记：用来描述网页内容的标签。

浏览器将会解释并执行标签所表示的内容

HTML是做什么的？

html可以开发网页，所用到的开发工具是HBuilderX

HTML的基础语法

首先我们要明白的是学习html本质上就是对标签的学习。

下面是就HTML中基本标签的解释和使用方法的说明：

html声明 html版本为html5 告诉浏览器以html5版的语法解释网页
<!DOCTYPE html> 
html称为根标签，网页中的所有内容都写在根标签中
<html>
    头部
	<head>
        设置网页信息  
		<meta charset="utf-8">
		<title>网页的标题</title>
	</head>
    身体，也是主要部分
	<body>
        标签内容都写在这里
	</body>
</html>

标签的分类：

闭合标签：

<a>   超链接   </a>
开始   标签体   结束

自闭和标签：

<br/>  <hr/>

标签属性：对标签内容进行修饰，写在开始标签中，书写形式为属性名=“属性值”。

常用标签

简单标签：

<h1></h1>  一级标题，h1~h6

<p></p>    段落

<br/>      强制换行

<ol>
    <li></li>  有序列表
</ol>

<ul>
    <li></li>  无序列表
</ul>
<hr/>       标尺线
<a></a>     超链接
<!--
    target="打开文件的位置"
    _self 默认在当前窗口打开   _blank 在新窗口打开
-->
<a href="链接的地址" target="打开文件的位置"></a>
<img/>      图像
<!--
    alt="图片不显示时的提示信息" 
    title="鼠标移动到图片时的提示信息"
-->
<img src="图片地址" alt="提示信息" title="提示信息" width="200" height="200"/>
注：标签嵌套一定要正确

表格中常用的标签和属性：

<!--
 表格：可以放数据，可以用来做网页布局
   table  表示表头
   tr     行
   td     单元格
   th     单元格 表示表头，其内容自动加粗并居中显示
   border="1"        边框线
   width="500"       宽
   height="500"      高
   cellpading="0"    内容到边框线的距离
   cellspacing="0"   单元格与单元格的距离
   bgcolor="red"     背景颜色
   backgrand="图片地址" 背景图片 优先于背景颜色
   下面表示一个三行三列的表格。
-->
<table border="1" width="500" height="500" cellpading="0" cellspacing="0" bgcolor="red" backgrand="图片地址">
    <tr>
        <th></th>
        <th></th>
        <th></th>
    </tr>
    <tr>
        <td></td>
        <td></td>
        <td></td>
    </tr>
    <tr>
        <td></td>
        <td></td>
        <td></td>
    </tr>
</table>
注：表格的内容只能在单元格中书写。

表单中常用的标签和属性：

<!--
  表单：由多个可以输入或者可以选择的组件组成，用户可以在表单中输入信息。
  form标签表示一个表单
        action="提交到服务器的地址"
        method="提交方式"
           input 
			    type="text"输入文本框
				  size="尺寸"
				type="password" 密码框
				type="radio" 单选框 name属性值相同为一组  可以互斥 只能选中一个
				type="checkbox"复选框 多选
				   checked="checked" 默认选中一项
				type="file" 文件选择框 
				      accept="" 筛选文件的格式
					  
				select 下拉选择框
					 option选项
					 selected="selected" 默认选中的选项
				<textarea></textarea>  多行文本输入域	 
						cols="50" 列
						rows="5" 行
          type="submit"  提交按钮 可以触发表单提交
                value="登录" 将按钮上的“提交”更改为“登录”
	      type="reset" 重置表单 让表单还原到原始形态
		  type="button" 普通按钮 触发事件
-->
<form action="" method="">
    账号：<input type="tsxt" size="20" /><br/>
    密码：<input type="password" size="20" /><br/>
    性别：<input type="radio" name="x"/>男
    <input type="radio" name="x" checked="checkde"/>女
    爱好：<input type="checkbox" />爱好1
    <input type="checkbox" />爱好2
    头像：<input type="file" accept=""/> 
    籍贯：<select>
			<option>北京</option>
			<option selected="selected">陕西</option> 
			<option>山西</option>
		    <option>上海</option>
		</select><br/>
    备注:<textarea cols="50" rows="5"></textarea><br/>
    <input type="submit" value="登录"/>
	<input type="reset" />
    <input type="button"/>
</form>

特殊符号转义：

<!--
    例如我们想在网页中显示“<b>标签的功能是文本加粗”时由于浏览器再遇到
<b>时，会认为这是一个标签从而导致出错，此时我们就要用到特殊符号转义。
下面是一些常用到的特殊符号转义：
&nbsp;    空格
&reg;     商标
&copy;    版权表
&lt;       <
&gt;       >
-->

棪小木

关注

2
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
学习HTML第一天总结

学习HTML第一天什么是HTML?HTML：是Hyper Text Markup Language的缩写，意思是超文本标记语言；文本：文字；超文本：指网页中所显示的超链接、图片、视频等；标记：用来描述网页内容的标签。浏览器将会解释并执行标签所表示的内容HTML是做什么的？html可以开发网页，所用到的开发工具是HBuilderXHTML的基础语法首先我们要明白的是学习html本质上就是对标签的学习。下面是就HTML中基本标签的解释和使
复制链接

扫一扫