HTML 超文本标记语言 (Hyper Text Markup Language)

1、HTML是什么

HTML指的超文本标记语言(Hyper Text Markup Language)，是一种用来描述网页的语言。超文本指的是除了可以包含文字之外，还可以包含图片、链接、音乐、视频、程序等内容。（每个都需要一个标记，在网页中通过不同的标记组成起来。）

HTML 指的是超文本标记语言 (Hyper Text Markup Language)
HTML 不是一种编程语言，而是一种标记语言 (markup language)
标记语言是一套标记标签 (markup tag)
HTML 使用标记标签来描述网页

前端三剑客。

2 常用的HTML标签

①    html     根标记

②    head     头标记

③    body     体标记

④    a        超链接

⑤    form     表单

⑥    table     表格

<!--

一个HTML页面最基本的组成部分

html: 跟标记

head：头标记  写描述性的信息（css\javaScricpt）

body: 体标记  写页面显示的信息

-->

<html>

    <head></head>

    <body>

        想写什么

    <!--标题标记 h1....-->

    <h1 align="center">E</h1>

    <h2 align="right">E</h2>

    <h3 align="left">E</h3>

    <!--超链接   href 可以指定应用内或者是应用外的任意地址-->

    <a href="http://www.baidu.com">跳转连接</a>

    <!-- 表格-->

    <h1 align="center">Information</h1>

    <table border="lpx" align="center" width="60%"> <!--内部是属性设置-->

        <!--tr : 表示一行-->

        <tr>

                <!--

                    th: 标题列 自带剧中并加粗效果

                    td: 普通列

                -->

                <th>ID</th>

                <th>Name</th>

                <th>Age</th>

        </tr>

                <td>12234</td>

                <td>Zhang</td>

                <td>Mail</td>

        <tr>

        </tr>

    </table>

    <!--表单： 收集用户的信息，提交到后台服务器-->

    <form action="提交的地址，例如http://www.baidu.com" method="GET/POST">

        用户名称：<input type="text" name="username" value="admim"/> <!--数据的提交方式：username=admin ,此时username相当于一个key -->

        <br/>  <!--换行-->

        用户密码：<input type="password" name="password"/>

        用户性别： 男<input type="radio" name="gender" value="1"/>

                  女<input type="radio" name="gender" value="0"/>   <!--通过在radio指定相同的name 来表示互斥的关系-->

        <br/>

        用户爱好：羽毛球<input type="checkbox" name="hobby" value="1"/>   <!--checkbox表示多选框-->

                  篮球<input type="checkbox" name="hobby" value="2"/>

                  乒乓球<input type="checkbox" name="hobby" value="3"/>

        <br/>

        用户地址：省份<select name="province">              <!--select 表示下拉列表-->

                        <option value="hb">河北省</option>

                        <option value="js">江苏省</option>

                        <option value="ah">安徽省</option>

                      </select>

        <br/>

        <input type="submit" value="注册"/>  <!--表示按钮，点击后向 action中的地址进行数据的提交-->

    </form>

    </body>

</html>

3、表现CSS

CSS 指层叠样式表 (Cascading Style Sheets)
样式定义如何显示 HTML 元素
样式通常存储在样式表中
把样式添加到 HTML 4.0 中，是为了解决内容与表现分离的问题
外部样式表可以极大提高工作效率
外部样式表通常存储在 CSS 文件中
多个样式定义可层叠为一

　　<div></div>：选中一部分区域，施加一些样式。描述性质的，所以需要写道head中。

<html>

<head>

        <style>

            div{    //元素选择器div(实际不能注释)    如果很多个div，设置不同的，可以在div中设置唯一的id， 在head 中#id{}   如果需要多个同一个设置，设置class属性，head中 .calsss{}

                width: 300px;

                height:300px;

                border:2px solid red;

            }

        </style>

    </head>

<body>

。。。。

<div>这是一个div</div>

<\body>

<\html>

同时可以利用样式文件：.css文件导入样式设置

<head>

<link rel="stylesheet" type="text/css" href="mystyle.css">

</head>

<!--

一个HTML页面最基本的组成部分

html: 跟标记

head：头标记  写描述性的信息（css\javaScricpt）

body: 体标记  写页面显示的信息

-->

<html>

    <head>

            <!--引入样式文件-->

        <link rel="stylesheet" type="text/css" href="mystyle.css">

        <style>

            div{

                width: 300px;

                height:300px;

                border:2px solid red;

            }

            #dd{

            background-color:blue;

            }

            .ss{

            background-color:yellow;

            }

        </style>

    </head>

    <body>

        想写什么

    <!--标题标记 h1....-->

    <h1 align="center">E</h1>

    <h2 align="right">E</h2>

    <h3 align="left">E</h3>

    <!--超链接   href 可以指定应用内或者是应用外的任意地址-->

    <a href="http://www.baidu.com">跳转连接</a>

    <!-- 表格-->

    <h1 align="center">Information</h1>

    <table border="lpx" align="center" width="60%"> <!--内部是属性设置-->

        <!--tr : 表示一行-->

        <tr>

                <!--

                    th: 标题列 自带剧中并加粗效果

                    td: 普通列

                -->

                <th>ID</th>

                <th>Name</th>

                <th>Age</th>

        </tr>

                <td>12234</td>

                <td>Zhang</td>

                <td>Mail</td>

        <tr>

        </tr>

    </table>

    <!--表单： 手机用户的信息，提交到后台服务器-->

    <form action="提交的地址，例如http://www.baidu.com" method="GET/POST">

        用户名称：<input type="text" name="username" value="admim"/> <!--数据的提交方式：username=admin ,此时username相当于一个key -->

        <br/>  <!--换行-->

        用户密码：<input type="password" name="password"/>

        用户性别： 男<input type="radio" name="gender" value="1"/>

                   女<input type="radio" name="gender" value="0"/>   <!--通过指定相同的name 来表示互斥的关系-->

        <br/>

        用户爱好：羽毛球<input type="checkbox" name="hobby" value="1"/>   <!--表示多选框-->

                  篮球<input type="checkbox" name="hobby" value="2"/>

                  乒乓球<input type="checkbox" name="hobby" value="3"/>

        <br/>

        用户地址：省份<select name="province">              <!--表示下拉列表-->

                        <option value="hb">河北省</option>

                        <option value="js">江苏省</option>

                        <option value="ah">安徽省</option>

                      </select>

        <br/>

        <input type="submit" value="注册"/>  <!--表示按钮，点击后向 action中的地址进行数据的提交-->

    </form>

    <div>这是一个div</div>  <!--对所有div的做标记，元素选择性-->

    <div></div>

    <div id="dd"></div>     <!--对某一个做标记，id选择性-->

    <div class="ss"></div>  <!--对某一类做标记，类选择性-->

    <div class="ss"></div>

    </body>

</html>

HTML 超文本标记语言 (Hyper Text Markup Language)的更多相关文章

超文本标记语言(Hyper Text Markup Language)：构建网页的语言
超文本标记语言(Hyper Text Markup Language):构建网页的语言
HTML：Hyper Text Markup Language 超文本标记语言
1.HTML是什么? *Hyper Text Markup Language 超文本标记语言 *Hyper Text:超链接.把不同空间的资源,整合在一起,形成逻辑上的网状结构. *Markup La ...
HTML （Hyper Text Markup Language）常用标签
HTML是什么? 英文全称:Hyper Text Markup Language 中文全称:超文本标记语言网页主要由机构表现行为组成什么是标签? < > 里的叫 ...
XML简介——可扩展标记语言（Extensible Markup Language）
(What) XML是什么? XML指可扩展标记语言(Extensible Markup Language) 1. XML是一种标记语言,类似HTML. 2. XML具有自我描述性 3. XML ...
HTML(超文本标记语言)的内容和理解
由于上篇文章中提到WebMethod的Description 属性(propery)中可以使用超文本,因此就记录一篇关于超文本的文章以供参考,注意:Description=" HTML格式 ...
html(HyperText Markup Language)--超文本标记语言
1.html的简介? * 什么是html? ** HyperText Markup Language:超文本标记语言,网页语言 ** 超文本:超出文本的范畴,使用html可以轻松实现这样操作: ** ...
超文本标记语言(HTML)
超文本标记语言(HyperText MarkUp Language,HTML) HTML是用来制作网页的标记语言,HTML不需要编译,直接由浏览器解析: HTML文件是一个文本文件,包含了一些HTML ...
超文本标记语言HTML
介绍html文档的基本结构,html常用标签的使用,理解html语言制作网页基本原理. html概述和基本结构 html概述 HTML是 HyperText Mark-up Language 的首字母 ...
html 超文本标记语言
1.html超文本标记语言 2.在html中存在着大量的标签,我们用html中存在的标签将要显示在网页的内容包含起来. 3.css 控制网页显示内容的效果. 4.html+css 只能是静态网页. 5 ...

随机推荐

Python装饰器：套层壳我变得更强了
Python装饰器:套层壳我变得更强了 Python装饰器:套层壳我变得更强了关于作用域和闭包可以聊点什么? 什么是作用域什么是闭包装饰器:套层壳我变得更强了参考资料昨天阅读了<Pyt ...
springmvc03-restful和控制器
一.控制器Controller 控制器复杂提供访问应用程序的行为,通常通过接口定义或注解定义两种方法实现. 控制器负责解析用户的请求并将其转换为一个模型. 在Spring MVC中一个控制器类可以包含 ...
记一次MySQL数据迁移到SQLServer全过程
为什么要做迁移? 由于系统版本.数据库的升级,导致测试流程阻塞,为了保证数据及系统版本的一致性,我又迫切需要想用这套环境做性能测试,所以和领导.开发请示,得到批准后,便有了这次学习的机会,所以特此来记 ...
Java中 equals和==的区分， new Integer和非new的区别
浅谈 equals 和 == ,new出的Integer和非new出的Integer 首先我们要知道在 == 比较的是内存地址值(不包括8种基本数据类型) equals比较的是两个值(内容)是否相同. ...
python中的sort用法
内置的列表类型提供sort的方法可以根据多项指标给list实例中的元素排序.在默认情况下,sort方法总是按照自然升序排列列表内的元素 #升序排列 list1=[2,3,1,2,5] list1.s ...
手脱FSG（2.0）
1.查壳 2.x32dbg脱壳在第二个xchg处使用ESP定律脱壳: 由于FSG壳特性,在跳转后位置向上查找,找到js\jne\jmp,jmp就是OEP位置: 在此处使用工具进行脱壳: 完成! 3. ...
【java并发编程】ReentrantLock 可重入读写锁
目录一.ReentrantLock可重入锁二.ReentrantReadWriteLock读写锁三.读锁之间不互斥欢迎关注我的博客,更多精品知识合集一.ReentrantLock可重入锁可 ...
使用VPLS跨地域多站点建立二层交换网络
VLL解决方案 https://www.cnblogs.com/darkchen/p/14652540.html 接上篇文档引出VPLS VLL可以跨地域建立二层交换网络,但有个缺陷是只支持两个sit ...
探索ABP基础架构-下
配置应用程序 ASP.NET Core 的配置系统提供了一个基于键值对的配置方法.它是一个可扩展的系统,可以从各种资源中读取键值对,例如 JSON 设置文件.环境变量.命令行参数等等. 设置配置值默 ...
Tenseal库
在此记录Tenseal的学习笔记介绍在张量上进行同态计算的库,是对Seal的python版实现,给开发者提供简单的python接口,无需深究底层密码实现. 当前最新版本:3.11 位置:A lib ...

HTML 超文本标记语言 (Hyper Text Markup Language)

HTML 超文本标记语言 (Hyper Text Markup Language)的更多相关文章

随机推荐

热门专题