您的位置: 首页  >  文章  >  html相关内容以及标签的使用方法

html相关内容以及标签的使用方法

分类: 文章 • 2023-11-14 20:14:40

html超文本标签语言

首先说一下浏览器的内核

html相关内容以及标签的使用方法


五大主流内核

Trident（ie内核）     ie   

Gecko (friefox)            火狐浏览器

chrome (blink)                谷歌浏览器 

webkit    (safari）           苹果浏览器 

opera   （blink）            欧朋浏览器


html相关内容以及标签的使用方法


代码标签：

<p></p>段落标签
<br>换行标签
<h></h>作为标题使用，并且依据重要性递减
<hr />水平线标签
页面布局的两个盒子
<div></div>缩写 分割
<span></span>跨度 范围

无序列表
<ul>
<li></li>
                  </ul>
html相关内容以及标签的使用方法

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

自定义列表
<dl>
<dt></dt>
<dd></dd>
        </dl>
后面的语意更加强烈，推荐后面的
<b></b>    <strong></strong>  加粗
<i></i>       <em></em>倾斜
<s></s>          <del></del>加删除
<u></u>                <ins></ins>加下划线

 图片标签 
基本图像的插入方式
<img    src=“图像url”/>
带有alt的图像       alt  替换文本
<img   src=“图像url”alt=“”/>  
带有title的图像
<img   src=“图像url”title=“”/>
带有宽度高度
<img   src=“图像url”title=“” width=“” height=“”/>
带有边框的图像border
<img   src=“图像url”title=“” width=“” height=“”border=“”/>

border    设置表格的边框
cellspacing   设置单元格与单元格边框之间的空白间距
cellpadding   设置单元格内容与单元格边框之间的空白间距
width  设置表格宽度
height  设置表格高度
align  设置表格在网页的水平对齐方式  
align=“ ”             居左  left   居中 center   居右right 


<table>  表格标签
<tr> </tr>  用于定义表格中的行   只能嵌套td标签
<td></td>单元格标签 必须在<tr>标签中  一对<tr>可以包含多个<td>标 签   可以容纳所有的元素
</table>

表头标签        将表格中的第一行或者第一列，其文本加粗居中
<th></th>


表头<thead></thead>
主体部分<tbody></tbody>
表格的标题标签<caption></caption>
合并单元格   跨行合并   rowpan=“”       跨列合并colspan=“”



链接标签                                     目标窗口的弹出方式
<a    href=“跳转目标”target=“_blank”>文本或图像</a>
                                        target=“_self”
                                       特定的网页当前窗口打开


瞄点定位
<a  href=“#名”>名称</a>
使用相应的id名标跳转目标的位置 


base标签
<base  target=“_blank”/>



html相关内容以及标签的使用方法



textarea表单控件  文本域
<textarea>  </textarea>



下拉菜单
<select>
        <option></option>

</select>

html相关内容以及标签的使用方法


html相关内容以及标签的使用方法html相关内容以及标签的使用方法


html5常用的新标签

html相关内容以及标签的使用方法


html相关内容以及标签的使用方法

html相关内容以及标签的使用方法

html相关内容以及标签的使用方法

<a href="http://www.runoob.com/" target="_blank"></a>你可以定义被链接的文档在何处显示

target="&quot;_blank&quot; 链接将在新窗口打开

无边框的图片链接:

<a href="http://www.runoob.com/html/html-tutorial.html">

<img border="0" src="smiley.gif" alt="教程" width="32" height="32"></a></p>

居中对齐

style="text-align:center;


iframe语法:

<iframe src="URL"></iframe>

该URL指向不同的网页。

<iframe src="demo_iframe.htm" width="200" height="200"></iframe>

frameborder 属性用于定义iframe表示是否显示边框


<iframe src="demo_iframe.htm" name="iframe_a"></iframe>
<p><a href="" target="iframe_a">点击</a></p>


<p><b>注意：</b> 因为 a 标签的 target 属性是名为 iframe_a 的 iframe 框架，所以在点击链接时页面会显示在 iframe框架中。</p>



与 HTML 相比最重要的区别：

文档结构

  • XHTML DOCTYPE 是强制性的
  • <html> 中的 XML namespace 属性是强制性的
  • <html>、<head>、<title> 以及 <body> 也是强制性的

元素语法

  • XHTML 元素必须正确嵌套
  • XHTML 元素必须始终关闭
  • XHTML 元素必须小写
  • XHTML 文档必须有一个根元素

属性语法

  • XHTML 属性必须使用小写
  • XHTML 属性值必须用引号包围
  • XHTML 属性最小化也是禁止的




相关推荐