HTML:超文本标记语言基本结构

<!DOCTYPE html>  <!--文档的声明 一个HTML文件就是一个文档  -->

<html lang="en"> <!-- -->

<head> <!--head 中的内容不会显示在浏览器上 双别和标签-->

    <meta charset="UTF-8"> <!-- 定义文档的编码类型  单闭合标签-->

    <title>Title</title> <!-- 显示标题-->

</head>

<body> <!--body中的内容都会显示到浏览器中 -->

</body>

</html>

body中标签的分类

行内标签

在一行内显示,不换行,不能设置宽高,默认是内容的宽高

span:标签被用来组合文档中的行内元素

 <span>hello</span>

a:超链接

<!--a:超链接,行内标签 -blank:在空白页面打开网页 title:鼠标悬浮显示-->

<a href="https://www.baidu.com/" target="_blank" title="跳转百度">跳转百度</a>

em或i:斜体标签

<body>

<em>hello</em>
<i>hello</i>

</body>

b或strong:粗体标签

<body>

<b>hello</b>

<strong>hello</strong>

</body>

u:下划线标签

<body>

<u>hello</u>

</body>

sup上标文本和sub下标文本

<body>

<sup>hello</sup>

<sub>hello</sub>

</body>

br:换行标签

<body>

<br>

</body>

hr:水平线标签

<body>

<hr>

</body>

center:居中标签

<body>

<center>hello</center>

</body>

块级标签

独占一行,可以设置宽高,如果不设置宽高,默认是内容的宽高

h1~h6: 块级标签:独占一行

<body>

<!--h1 只允许页面中只有一个,为了seo和爬虫-->

<h1>hello</h1>

<h2>hello</h2>

<h3>hello</h3>

<h4>hello</h4>

<h5>hello</h5>

<h6>hello</h6>

</body>

div:分割页面

<body>

<!--id在文档中是唯一的,为div添加标识-->

<div id="top">

    <!--class可以重复,为div添加标识-->

    <div class="top-l">

        <!--span:是行内标签,一行内显示-->

        <span>hello</span>

        <!--a:超链接,行内标签 -blank:在空白页面打开网页 title:鼠标悬浮显示-->

        <a href="https://www.baidu.com/" target="_blank" title="跳转百度">跳转百度</a>

        <!--img:引入图片-->

        <img src="https://ss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=3234070121,1596383226&fm=11&gp=0.jpg" alt="图片加载失败的文本">

        <!--取消a标签的自动跳转-->

        <a href="javascript:void(0)">hello</a>

    </div>

</div>

</body>

P:换行,只能放 字体标签和img 表单 imput,不能放块

<p>hello</p>

<p>hello</p>

ul:无序列表,它的子元素自能是li标签

<ul>

    <li></li>

    <li></li>

    <li></li>

</ul>

ol:有序列表

<ol>

    <li></li>

    <li></li>

    <li></li>

</ol>

dl:自定义列表

<ol>

    <li></li>

    <li></li>

    <li></li>

</ol>

table

<table border="1" style="border-collapse: collapse">

    <tr>

        <td>name</td>

        <td>age</td>

    </tr>

    <tr>

        <td>wl</td>

        <td>18</td>

    </tr>

</table>

解决a标签不能设置宽高的问题

style="display: block"

  <a href="">

            <img src="https://ss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=3234070121,1596383226&fm=11&gp=0.jpg"

                 alt="" style="display: block ;height: 100px ;width: 100px" >

  </a>


　　
												


											
HTML 标题标签的更多相关文章
	

    
						
  1. 我给女朋友讲编程html系列(2) --Html标题标签h1
		
    Html是一门标签语言,因此学习Html最快的方式就是学习使用html标签. html标题标签:h1,h2,h3,h4,h5,h6 标题标签总共有6个,h1,h2,h3,h4,h5,h6,从h1到h6 ...
    
		
    2. 
						
  2. 前端 HTML body标签相关内容 常用标签 标题标签 h1-h6
		
    标题标签 h1~h6 <h1> - <h6> 标签可定义标题.<h1> 定义最大的标题.<h6> 定义最小的标题. 由于 h 元素拥有确切的语义,因此请 ...
    
		
    3. 
						
  3. HTML之基本语法（段落标签、标题标签、空格标签、换行标签、图片标签和图片的基本属性）
		
    一.HTML标签 所谓的HTML的标签就是发明者认为定义好的一些单词,就相当于我们汉语中的字 二.HTML的语法 语法就是用来定义这些“字”应该如何解析或者书写的规则 三.常见标签及基本语法 1.人为 ...
    
		
    4. 
						
  4. [19/06/03-星期一] HTML基础_C/S与B/S的区别&标题标签(h1-h6)、段落标签(p)
		
    一.C/S与B/S的区别 C/S(Client/Server):客户端/服务器 1)一般使用的软件都是C/S架构,比如QQ.360.office365: 2)C表示客户端,用户通过客户端来使用软件:S ...
    
		
    5. 
						
  5. 【HTML】学习路径3-段落标签和标题标签
		
    第一章:标题标签 <h1>  </h1> <h2>  </h2> 等等... 数字越大,字体尺寸越小. <!--标题会加粗.独占一行-->  ...
    
		
    6. 
								
  6. html基础-标题标签-文字标签（2）
		
    昨天说道了我的第一个网页,今天接着继续带大家深入,前期学习千万不要用代码工具哦!那样就少了深入了解的机会了哦! 一.大家都知道文章会有各种标题,网页其实也跟文章差不多也有专门来写标题的元素. (1). ...
    
		
    7. 
						
  7. 在文章详情页调用seo标题标签
		
    在新闻的详情页,调用当前栏目的seo标题,原标签是:{dede:field.seotitle /} {dede:type} [field:seotitle/] {/dede:type} 修改 \inc ...
    
		
    8. 
						
  8. <h1>~<h6> 标题标签
		
    <h1>~</h6>标题系列标签 解释:h1到h6 中h1标签最大,h6标签最小,逐一递增. 例如: <h1>标签</h1> <h2>标签& ...
    
		
    9. 
						
  9. HTML头信息标签和标题标签
		
    <html> <!-- 头信息的作用 1. 可以设置网页的标题. 2. 可以通知浏览使用指定的码表解释html页面. --> <head> <meta htt ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. 解开一个疑惑，为什么LVS开放的端口，使用netstat或ss命令，不能查找到其监听的端口呢？
			
    RT, 这个疑问,本周一直在心里,今天找到一个说法. ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ 另外LVS规则算是内核方法,用netstat -ntulp也显 ...
    
			
    2. 
						
  2. [转] babel入门基础
			
    背景 babel的官网说babel是下一代的js语法编译器,现在自己也在很多项目中使用了babel,可是自己对babel的认识呢,只停留在从google和别人项目中copy的配置代码上,内心感到很不安 ...
    
			
    3. 
						
  3. BZOJ 3745
			
    题解: 分治好题 首先暴力显然rmq可以做到n^2 比较容易想到是以最值分治,这样在数据随机复杂度是nlogn,不随机还是n^2的 以最值分治只有做多与较小区间复杂度相同才是nlogn的 而这题里我们 ...
    
			
    4. 
						
  4. 【Android】android:windowSoftInputMode属性详解
			
    activity主窗口与软键盘的交互模式,可以用来避免输入法面板遮挡问题,Android1.5后的一个新特性. 这个属性能影响两件事情: [一]当有焦点产生时,软键盘是隐藏还是显示 [二]是否减少活动 ...
    
			
    5. 
						
  5. sparkStreaming序列化问题
			
    执行sparkSTreaming+kafka 报错如下: org.apache.spark.SparkException: Task not serializable ...... Caused by ...
    
			
    6. 
						
  6. Fiddler的安装与使用
			
    Fiddler是位于客户端和服务器端之间的代理,也是目前最常用的抓包工具之一 .它能够记录客户端和服务器之间的所有 请求,可以针对特定的请求,分析请求数据.设置断点.调试web应用.修改请求的数据,甚 ...
    
			
    7. 
						
  7. 今天才知道原来我还没弄清楚js中全局变量和局部变量的定义...
			
    查资料看到这段还不错,来源:原文:https://blog.csdn.net/czh500/article/details/80429133 粘过来记录一下... 1.使用var声明变量,在方法内部是 ...
    
			
    8. 
						
  8. UOJ#310 【UNR #2】黎明前的巧克力 FWT 多项式
			
    原文链接https://www.cnblogs.com/zhouzhendong/p/UOJ310.html 题目传送门 - UOJ#310 题意 给定 $n$ 个数 ,请你选出两个不相交的集合(两个 ...
    
			
    9. 
						
  9. Tomcat中文乱码解决办法
			
    有时候发现自己将中文编码后还是会存在乱码的情况,解决办法就是在Server.xml中的Connector结点,配置 URIEncoding="UTF-8"即可
    
			
    10. 
						
  10. 《第六周java学习笔记》
			
    教材知识点总结 Java 把 String 类定义为 final 类. new 运算符首先分配内存空间并在内存空间中放入字符序列,然后计算出引用.(new String(char a[],int st ...
    
			
    11.