整合营销服务商

电脑端+手机端+微信端=数据同步管理

免费咨询热线:

HTML基础的 <p> 标签

以下代码标记了一个段落:

<p>这是一个段落。</p>


浏览器支持

目前大多数浏览器支持 <p>标签。


标签定义及使用说明

<p> 标签定义段落。

<p>元素会自动在其前后创建一些空白。浏览器会自动添加这些空间,您也可以在样式表中规定。


在HTML 4.01 与 HTML5中的差异

HTML 4.01中标签的 align 属性已经废弃,HTML5不支持该属性。


属性

属性描述
alignleftrightcenterjustifyHTML5不支持。 HTML 4.01已废弃。 不赞成使用。请使用样式取代它。 规定段落中文本的对齐方式。

全局属性

<p> 标签支持全局属性,查看完整属性表 HTML全局属性。


事件属性

<p> 标签支持所有 HTML事件属性。

如您还有不明白的可以在下面与我留言或是与我探讨QQ群308855039,我们一起飞!

TML(HyperText Markup Language)是一种用于创建网页的标记语言。它由一系列的标签组成,这些标签用于描述网页的结构和内容。HTML标签通常由尖括号包围,例如<tag>

HTML标签可以分为两类:块级元素和内联元素。块级元素用于组织网页的结构,例如段落、标题、列表等。内联元素用于标记文本中的特定部分,例如链接、强调文本等。

HTML标签可以包含属性,属性提供了有关标签的额外信息。例如,<a>标签用于创建链接,可以使用href属性指定链接的目标URL。

除了标签和属性,HTML还支持一些特殊字符实体,用于表示特殊字符,例如小于号(<)、大于号(>)等。

HTML可以与CSS(层叠样式表)和JavaScript一起使用,以增强网页的外观和功能。CSS用于控制网页的样式,例如颜色、字体、布局等。JavaScript用于实现交互性和动态效果,例如表单验证、动画等。

通过使用HTML,开发人员可以创建具有结构良好、易于理解和导航的网页。它是构建互联网的基础之一,被广泛应用于网站开发和内容管理系统。

HTML的语法由标签、属性和内容组成。下面是HTML的基本语法规则:

  1. 标签:HTML标签用于定义网页的结构和内容。标签通常由尖括号包围,例如<tag>。标签可以是成对出现的,其中包含一个开标签和一个闭标签,例如<tag>content</tag>。也可以是自闭合标签,即只有一个标签,没有内容,例如<tag />
  2. 属性:HTML标签可以包含属性,属性提供了有关标签的额外信息。属性通常以键值对的形式出现,例如<tag attribute="value">。属性的值可以是字符串或布尔值。常见的属性包括classidsrchref等。
  3. 内容:HTML标签可以包含文本内容或其他标签。文本内容直接放置在标签的开闭标签之间,例如<p>这是一个段落。</p>。标签可以嵌套在其他标签中,形成标签的层次结构。
  4. 注释:HTML注释用于在代码中添加注释,不会在网页中显示。注释以<!--开头,以-->结尾,例如<!-- 这是一个注释 -->

下面是一个简单的HTML示例:

<!DOCTYPE html>
<html>
<head>
  <title>我的网页</title>
</head>
<body>
  <h1>欢迎来到我的网页</h1>
  <p>这是一个段落。</p>
  <a href="https://www.example.com">点击这里</a>访问示例网站。
</body>
</html>

在这个示例中,<!DOCTYPE html>声明了文档类型为HTML5。<html>标签是HTML文档的根元素。<head>标签用于定义文档的头部信息,例如标题和样式表。<title>标签定义了网页的标题,将显示在浏览器的标题栏中。<body>标签用于定义文档的主体内容。<h1>标签定义了一个一级标题,<p>标签定义了一个段落,<a>标签定义了一个链接。

天遇到个来咨询利用原生的JS代码来修改HTML代码的的童鞋,耐心的给这个童鞋做了解答后,然后整理了一下测试代码,写成文章记录一下,方便以后有同需求的站长们。

目标需求

HTML原始代码

<form action="" method="post" class="form">
 <input id="mm" type="text" >
 <input id="mochu" type="text" onclick="act(this.value)" />
 <input id="mc" type="text" >
</form>

目标要求:

利用JS代码将以上HTML代中的 id 为 mochu 的 input 中的 cnclick 属性去掉

<input id="mochu" type="text" onclick="act(this.value)" />

换成

<input id="mochu" type="text" />

解决方案

利用 JS中dom对象的 outerHTML 属性,可以轻松的解决这个问题

outerHTML:设置或获取对象及其内容的 HTML 形式

例:JS获取元表本身的HTML代码

代码:

<!DOCTYPE html>

<html>

<head>

</head>

<body>

<form action="" method="post" class="form">

<input id="mm" type="text" value="飞鸟慕鱼博客" >

<input id="mochu" type="text" onclick="act(this.value)" value="http://www.feiniaomy.com" />

<input id="mc" type="text" >

</form>

<script>

var html = document.getElementById('mochu').outerHTML;

console.log(html);

</script>

</body>

</html>

打印结果:

例:js修改指定元素的本身的HTML代码

通上面的例子,可以知道 outerHTML 属性可以获取到元素本身的HTML代码,既然可以获取也能设置或修改元素本身的代码

代码:

<!DOCTYPE html>
<html>
<head>
</head>
<body>
<form action="" method="post" class="form">
 <input id="mm" type="text" value="飞鸟慕鱼博客" >
 <input id="mochu" type="text" onclick="act(this.value)"/>
 <input id="mc" type="text" >
</form>
<script>
 var html = document.getElementById('mochu').outerHTML = '<input id="mochu" type="text" value="http://www.feiniaomy.com" />';
</script>
</body>
</html>

运行结果如图所示

补充说明

以下是与 outerHTML 功能相似的属性,下一篇文章会详细说明一下他们的作用与区别

innerHTML:设置或获取对象起始标签和结束标签之间的内容。

innerText:设置或获取位于对象起始和结束标签内的文本

outerHTML:设置或获取对象及其内容的 HTML 形式

outerText:设置或获取对象的文本