HTML常用标签及属性_html常用标记及属性-CSDN博客

本文链接：https://blog.csdn.net/qq_36056932/article/details/52443406

HTML的操作思想

网页中有很多的数据，不同的数据可能需要不同的显示效果，

这个时候需要使用标签把要操作的数据包起来，

通过修改标签的属性实现标签内数据样式的变化。

一个标签相当于一个容器，想要修改容器内数据的样式，

只需要改变容器的属性值，就可以实现容器内数据样式的变化。

文字标签和注释标签

*文字标签：修改文字的样式

属性：

size：文字的大小，取值范围1-7.超过7默认为7.

color：文字颜色

俩种表达方式

1.英文单词表达

red，green，blue

2.使用十六进制数表示

#FFFFFF

*注释标签

Java有三种注释，HTML只有一种注释：

标题标签。水平线标签。特殊字符

标题标签、水平线标签和特殊字符

*标签标签

<h1> 这是标题标签，数字越小标题越大 </h1>.....<h6></6>

*水平线标签

<hr/>

属性：

size：水平线的粗细

color：水平线的颜色

*特殊字符

&nbsp；代表空格

< 代表<

> 代表>

& 代表&

&copy；代表版权符 ©

&reg；代表注册符

&quot；代表双引号

列表标签

比如：

传智播客

财务部

学工部

人事部

<dl>表示列表的范围</dl>

*在<dl>里面，<dt>代表上层内容

<dd>代表下层内容

<dl>

<ol>有序列表的范围

属性：type设置排序的方式1（默认），a，i。type="1"

在<ol>里面<li>代表具体内容

无序列表：

<ul>标签

属性：type="circle".circle空心圆，disc实心圆，square实心方块，默认disc

图像标签

图像标签：

<imgsrc="图像的路径">

width:表示图片的宽度

height：表示图片的长度

alt：表示图片上显示的文字

路径的介绍

**路径的介绍

绝对路径：C:\user\pictuers\a.jpg http://www.baidu.com

相对路径：一个文件相对于另一个文件的位置，HTML文件和照片在同一目录下直接写文件名称

列表标签的使用

<br/> 换行

标签可以嵌套标签

超链接标签

链接资源：

<ahref="链接资源的路径">显示在页面上的内容</a>

Target：设置打开的方式，默认是当前页面打开

*_Blank：在一个新页面打开

*_self：当前页面打开，默认

当超链接不需要打开任何地址的时候在href里面加#，不加#时会在本地文件中打开

定位资源：当一个页面需要回到顶部的时候就要用到定位资源

如果想要定位资源，定义一个位置

<aname="top">顶部</a>

回到这个位置

<ahref="#top">回到顶部</a>

<pre>：表示原样输出

表格标签

可以对数据进行格式化，使数据显示更清晰

<table> </table>表示表格的范围

在<table>里面<tr></tr>

在<tr>里面<td></td>

属性：

Border：表格线

Boredercolor：表格线的颜色

Cellspacing：单元格之间的距离

Width：表格的宽度

Height：表格的高度

设置对齐方式：

Align：center，right，left

使用<th>也可以表示单元格，可以实现居中加粗

表格的标题：

合并单元格：

Rowspan：跨行

Colspan：跨列

表单标签（重要）

<form></form> 定义表单的范围

输入项：输入内容或选择内容的部分

普通输入项：<inputtype="text"/>

密码输入项：<inputtype="password"/>

单选输入项：<inputtype="radio"/>

在里面需要一个属性name(name="sex"/)

Name的属性必须相同

复选输入项：<inputtype="checkbox" name="hobby"/>

<checked="checked">默认选择

文件输入项：<inputtype="file"/>

下拉输入项：(不是在input里面的标签)

<selectname="birthday">

<optionvalue="请选择">请选择</option>

<optionvalue="1993">1993</option>

文本域：

自我描述<textareacols="10" rows="10"></rows>

隐藏项：不会显示在页面上，只在HTML中显示

<inputtype="hidden">

提交按钮：

<inputtype="submit" value="注册">

以上所有必须有一个value属性值0

面试题目：

Get和post的区别：

Get请求地址栏会携带提交的数据，post不会提交

Get安全级别较低，post较高

Get请求数据大小的限制，post没有

Enctype：一般不需要这个属性，做文件上传的时候需要这个属性

重置按钮：<input type="reset"> 回到输入项的初始状态

普通按钮：<inputtype="button">

常用标签的使用

<span>在一行显示</span>

<p>段落标签

HTML头标签的使用

HTML的俩部分组成，head和bady

在head里面的标签就是头标签

Title：表示在标签里面显示的内容

<base>设置超链接的基本设置

框架标签的使用

属性：

*rows按照行进行划分

*cols按照列划分

<target="right">在当前打开超链接然后在右边打开

使用框架标签之后不能再使用body标签

</frameset>

</fraemset>

CSS简介

什么是CSS？

CSS就是层叠样式表。

CSS与HTML结合方式

1.每一个HTML标签上都有一个属性style，把CSS与HTML结合在一起。

2.使用HTML的一个标签实现style标签，写在head里面，

<stylety[e=”text/css”>

<div>{

Color=red;

}

</style>

3.在style标签里面，使用语句：

@import URL(css文件的路径)

{

}