• HTML基础


    HTML

    一、HTML概述

    HTML全称:Hyper Text Markup Language(超文本标记语言)超文本标记语言是标准通用标记语言(SGML)下的一个应用,也是一种规范,一种标准,它通过标记符号来标记要显示的网页中的各个部分。HTML是一门用户创建网页文档的标记语言,网页文件本身是一种文本文件,通过在文本文件中添加标记符。HTML可以告诉浏览器如何显示其中的内容(如:文字如何处理,画面如何安排,图片如何显示、包括音频、视频等等如何播放)。简单一句话:HTML是一门用来创建网页的标记语言。

    • 网页:网页,是网站中的一个页面,通常是网页是构成网站的基本元素,是承载各种网站应用的平台。通俗的说,网站就是由网页组成的。通常我们看到的网页都是以htm或html后缀结尾的文件,俗称 HTML文件。

    二、版本发展

    HTML4.01 传统使用,现在一般不使用,最为流行的Html5, html5的诞生是随着移动互联网的崛起。

    三、基本结构

    <html>
        <head>
              <meta charset="utf-8" />
              <title> 这里是标题 </title>       
        </head>
        <body>
              这里是主内容
        </body>
    </html>   
    

    网页文件的扩展名为*.html

    五、HTML语法

    5.1基本语法
    <!DOCTYPE html>
    

    文档声明:告诉浏览器使用的是HTML5版本

    <tag>内容</tag> 标签:一般都是成对出现的,还有<tag/>表示闭合标签
    
    5.2属性语法
    <tag attr="value" attrName="name"></tag> attr是标签的属性,可以有多个,控制标签的行为
    
    5.3标签的嵌套
    <A>
    	<B>
        </B>
    </A>
    

    标签B作为标签A的内容

    六、标签的详解

    6.1排版
    6.1.1结构标签
    1、html
    2、head、title
    3、body
    
    <!DOCTYPE html>   <!-- 声明文档类型 html5   -->
    <html>
    	<head>              <!-- 网页头(显示在浏览器选项卡中,或者页面配置信息) -->
    		<meta charset="utf-8" />  <!--页面编码 -->
    		<title>这里是标题</title>       <!--标题-->
    	</head>
    	<body>   <!-- 网页的主体 -->
    		这里是内容
    	</body>
    </html>
    
    6.1.2标题标签
    ###### 1.2 标题标签
    
    ​```
    <h1>小明和小红</h1>
    <h2>小明和小红</h2>
    <h3>小明和小红</h3>
    <h4>小明和小红</h4>
    <h5>小明和小红</h5>
    <h6>小明和小红</h6>
    

    h1 - h6 数字越大 字体越小。 用来做标题展示

    6.1.3段落标签

    <p>
        这里是p标签
    </p>
    
    6.1.4 水平线
    <hr size="4" color="red"/>
    

    是一个闭合标签,size属性控制粗细,color控制颜色

    6.1.5换行

    新开一行,起到回车的作用

    6.1.6空格

    转移符&nbsp;
    

    表格空格,两个&nbsp一起使用是一个空格

    6.2区块
    6.2.1内联元素
    <span>区内容</span>
    

    不换行,多个span在一行,将来结合css进行样式控制文本的外观

    6.2.2块(块级元素)
    <div> 块内容</div>
    

    块元素占一行,能够结合css控制页面的布局
    日期框

    七、框架

    把更多的功能页面集成在一个页面中。减少页面的跳转。

    Iframe

    在一个页面中预留一个窗口(理解为一空间)这个空间用于来展现其他页面。

    <!DOCTYPE html>
    <html>
    	<head>
    		<meta charset="utf-8">
    		<title></title>
    	</head>
    	<body>
    		<h1>上边内容</h1>
    		<a href="tag_form.html" target="myframe"  >form表单案例</a> 
    		<a href="tag_font.html" target="myframe">字体案例</a> 
    		<a href="tag_tab.html" target="myframe">表格案例</a>
    		<iframe name="myframe" width="100%" height="200px" frameborder="no"></iframe>
    		<h1>下边内容</h1>
    	</body>
    </html>
    
    
    frameset

    称为框架集,用于整合多个frame,实现页面的整合。

    <frameset rows="10%,*" frameborder="0" >
    	
    	<frame src="top.html" noresize="noresize" />
    	 
    	<frameset cols="15%,*">
    		<frame src="left.html" noresize="noresize" />
    		<frame name="nbframe"  noresize="noresize"/>
    	</frameset>
    
    </frameset>
    
    

    frameborder 去边框 noresize 禁用调整大小

  • 相关阅读:
    Java泛型学习笔记
    Java泛型学习笔记
    Java泛型学习笔记
    Java泛型学习笔记
    Java泛型学习笔记
    Java泛型学习笔记
    Java泛型学习笔记
    有1到100共100个数, 从1开始, 每隔1, 2, 3... 个数拿走一个数, 最后剩下几?(约瑟夫环)
    推荐一个自动抽取pdf高亮笔记的web应用
    协程
  • 原文地址:https://www.cnblogs.com/codeli/p/12763679.html
Copyright © 2020-2023  润新知