html基本标签(慕课网)

简介: html标签:  1、标签,短文本引用(quote,引用)    注解:引用短文本,比如引用古人的一句话 ,注意引用的文本不需要再加双引号。       标签的真正关键点不是它的默认样式双引号(和手输双引号效果一样但意义不一样),而是它的语义:引用别人的话。

html标签:

  1、<q>标签,短文本引用(quote,引用)

    注解:引用短文本,比如引用古人的一句话 ,注意引用的文本不需要再加双引号

       <q>标签的真正关键点不是它的默认样式双引号(和手输双引号效果一样但意义不一样),而是它的语义:引用别人的话。

       引用效果:

       双引号效果:

  2、<blockquote>,长文本引用

    注解:引用长文本,比如引用古人的一句话 ,注意引用的文本不需要再加双引号,显示也不会出现双引号,

       因为 浏览器对<blockquote>标签的解析是缩进样式

       

 

  3、&nbsp;   ,空格

    注解:html中加空格并不会显示出来,用&nbsp;来添加空格  

       注意不需要<&nbsp> ,注意不要忘记分号;

       nb(牛逼)sp(space空格)

 

  4、<address> ,为网页加入地址信息

    注解:也可以定义一个地址(比如电子邮件地址)、签名或者文档的作者身份。

    注意: <address>不但斜体,且另起一段。 <em>只是斜体,没有另起一段。

    

 

  5、<code> ,用于添加一行代码

    注解:当代码为一行代码时,可以使用<code>标签,目的:防止浏览器误认为是要执行代码,而没显示代码。加了标签浏览器就不会执行了,而是像文本一样显示出来

    

   

  6、<pre>,加入大段代码 

    注解:<pre> 标签的主要作用:预格式化的文本。被包围在 pre 元素中的文本通常会保留空格和换行符。

     

 

   7、<ul></ul> 列表标签 (<ol></ol>)

    注解:列表可以使用ul-li标签来完成。ul-li是没有前后顺序的信息列表。

                     ol-li是有顺序的信心列表

    

 

  8、<div> 

    注解:可以把一些独立的逻辑部分划分出来,放在一个<div>标签中,这个<div>标签的作用就相当于一个容器。

    一个html页面可以看成一个家,而每一个div可以看成家的每个小房间,每个小房间的装饰由css负责

    <div id="模块名称"> 每一个<div>都可以有一个id, 这个id 就相当于每个房间的门牌号

    

  9、<table> 表格标签

1、<table>…</table>:整个表格以<table>标记开始、</table>标记结束。

2、<tbody>…</tbody>:当表格内容非常多时,表格会下载一点显示一点,但如果加上<tbody>标签后,这个表格就要等表格内容全部下载完才会显示

3、<tr>…</tr>:表格的一行,所以有几对tr 表格就有几行。

4、<td>…</td>:表格的一个单元格,一行中包含几对<td>...</td>,说明一行中就有几列。

5、<th>…</th>:表格的头部的一个单元格,表格表头。

6、表格中列的个数,取决于一行中数据单元格的个数。

7、<caption></caption> 表格的标题

8、summary 摘要 <table summary=""> 不在界面上显示

 

   10、<a></a> ,网页链接

    注解:<a href="http://www.baidu.com"  title="点击进入百度">百度</a>

      对"百度"进行网页点击 ,点击进入,title的作用是当鼠标放在"百度"文本上的时候,会出现title的内容提示"点击进入百度"

      如图:             ,注意 这是从当前页面打开链接指向的页面

      

      <a href="目标网址" target="_blank">百度</a>  ,target 表示新页面的打开方式

_blank -- 在新窗口中打开链接 

_parent -- 在父窗体中打开链接 

_self -- 在当前窗体打开链接,此为默认值 

_top -- 在当前窗体打开链接,并替换当前的整个窗体(框架页) 

一个对应的框架页的名称 -- 在对应框架页中打开

 

 

  11、文本输入框标签 <input type="text" name="content" value="请输入文本">

    注解:type 分为text(文本输入框) ,password(密码输入框) . 

         name: 文本框命名,以备后台程序ASP 、PHP使用。

       value:为文本输入框设置默认值。(一般起到提示作用)

     

  12、单选框、复选框

语法:

<input   type="radio/checkbox"   value=""    name="名称"   checked="checked"/>
1、type:

   当 type="radio" 时,控件为单选框

   当 type="checkbox" 时,控件为复选框

2、value:提交数据到服务器的值(后台程序PHP使用)

3、name:为控件命名,以备后台程序 ASP、PHP 使用

4checked:当设置 checked="checked" 时,该选项被默认选中

5、注意:同一组的单选按钮,name 取值一定要一致,比如上面例子为同一个名称“radioLove”,这样同一组的单选按钮才可以起到单选的作用。

  

          

 

      

 

 

 

 

 

 

 

 

  

 

相关文章
|
1月前
|
移动开发 HTML5
HTML5标签的类型
HTML5标签的类型。
48 5
|
3月前
|
数据采集 移动开发 前端开发
HTML代码的革命:语义化标签的魅力,让你的网页结构焕然一新!
【8月更文挑战第26天】本文探讨了Web前端开发中的语义化标签概念及其重要性。语义化标签通过使用具有明确含义的HTML标签来构建页面结构,提升了网页的可访问性及搜索引擎优化效果,并增强了代码的可读性和维护性。文章还讨论了实际开发中遇到的问题及未来发展趋势。
51 0
|
2天前
|
移动开发 编解码 UED
除了 `<audio>` 和 `<video>` 标签,HTML5 还支持哪些多媒体格式?
【10月更文挑战第19天】HTML5对多种多媒体格式的支持,为网页开发者提供了丰富的选择,能够更好地满足不同类型多媒体内容在网页中的展示和交互需求,提升了网页的用户体验和多媒体应用的多样性。
|
2天前
|
存储 移动开发 前端开发
|
30天前
|
前端开发
【HTML】img标签和超链接标签
【HTML】img标签和超链接标签
37 2
|
30天前
|
移动开发 前端开发 JavaScript
【HTML】HTML页面和常见标签
【HTML】HTML页面和常见标签
30 1
|
2月前
|
前端开发
前端基础(二)_HTML常用标签(块级标签、行级标签、行块级标签)
本文详细介绍了HTML中的常用标签,包括块级标签(如`h1`至`h6`、`p`、`div`等)、行级标签(如`span`、`b`、`strong`、`i`、`em`、`sub`、`sup`、`del`、`a`等),以及行块级标签(如`img`)。文章解释了这些标签的用途、特点和基本用法,并通过示例代码展示了如何在HTML文档中使用它们。
99 1
|
2月前
|
移动开发 开发者 UED
HTML5中video标签controlslist属性的使用方法
`controlsList`属性为开发者提供了更多控制HTML5视频播放器行为的能力,让视频内容的集成更加灵活和符合需求。通过精心设计的控制列表,可以提升用户体验,同时保持内容的安全性和专业性。这种细节的控制和定制能力是现代Web开发的一个重要方面,反映了HTML5对开发者和内容创作者需求的响应。
174 1
|
2月前
|
存储 JavaScript Java
使用NekoHTML解析HTML并提取META标签内容
关于NekoHTML的代码样例,这里提供一个简单的示例,用于展示如何使用NekoHTML来解析HTML文档并提取其中的信息。请注意,由于NekoHTML的具体实现和API可能会随着版本更新而有所变化,以下代码仅供参考。 ### 示例:使用NekoHTML解析HTML并提取META标签内容 ```java import org.cyberneko.html.parsers.DOMParser; import org.w3c.dom.Document; import org.w3c.dom.Element; import org.w3c.dom.NodeList; import org.xml
|
2月前
|
XML JavaScript Java
NekoHTML 是一个基于Java的HTML扫描器和标签补全器
**NekoHTML** 是一个基于Java的HTML扫描器和标签补全器(tag balancer),由J. Andrew Clark开发。它主要用于解析HTML文档,并能够“修正”许多在编写HTML文档过程中常犯的错误,如增补缺失的父元素、自动用结束标签关闭相应的元素,以及处理不匹配的内嵌元素标签等。这使得程序能够以标准的XML接口来访问HTML文档中的信息。 ### NekoHTML的主要特点包括: 1. **错误修正**:能够自动修正HTML中的常见错误,如未闭合的标签等。 2. **DOM树生成**:将HTML源代码转化为DOM(Document Object Model)结构,便