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 ...
随机推荐
- 从0开始基于Webpack5 搭建HTML+Less 前端工程
基于Webpack5 搭建HTMl+Less的前端项目 新建一个文件夹(比如命名为webpack) 用编辑器打开该文件夹,并在编辑器的终端执行 npm init -y 自动创建pa ...
- 论文解读(Debiased)《Debiased Contrastive Learning》
论文信息 论文标题:Debiased Contrastive Learning论文作者:Ching-Yao Chuang, Joshua Robinson, Lin Yen-Chen, Antonio ...
- 浅尝Spring注解开发_AOP原理及完整过程分析(源码)
浅尝Spring注解开发_AOP原理及完整过程分析(源码) 浅尝Spring注解开发,基于Spring 4.3.12 分析AOP执行过程及源码,包含AOP注解使用.AOP原理.分析Annotation ...
- 简易版 vue实现
Vue-mini 完整的Demo示例:git@github.com:xsk-walter/Vue-mini.git 一.Vue实例 构造函数: $option\ $el\ $data 判断是否存在 通 ...
- python工具---snmp流量监控,自定义粒度,业务突发可视化
现在主流监控软件和云平台提供的流量监控,监控粒度最小只能设置为1分钟,无法准确定位故障,特别是瞬时突发较大的业务 对比python的snmp库还是更喜欢用subprocess调用snmpwalk命令, ...
- Java中的线程到底有哪些安全策略
摘要:Java中的线程到底有哪些安全策略呢?本文就为你彻底分析下! 本文分享自华为云社区<[高并发]线程安全策略>,作者:冰 河 . 一.不可变对象 不可变对象需要满足的条件 (1)对象创 ...
- leetcode 524. Longest Word in Dictionary through Deleting 通过删除字母匹配到字典里最长单词
一.题目大意 https://leetcode.cn/problems/longest-word-in-dictionary-through-deleting 给你一个字符串 s 和一个字符串数组 d ...
- 使用Spring MVC开发RESTful API(续)
使用多线程提高REST服务性能 异步处理REST服务,提高服务器吞吐量 使用Runnable异步处理Rest服务 AsyncController.java @RestController @GetMa ...
- 好客租房16-jsx中的列表渲染
如果要渲染一组数组 应该使用数组的map方法 注意:渲染列表时候添加key属性 key属性的值要保持唯一 原则:map()遍历谁 就给谁添加key属性 尽量避免索引号作为key //导入react i ...
- 好客租房21-react组件的两种创建方式(函数组件)
1使用函数创建组件 函数组件:使用js的函数或者箭头函数创建的组件 约定1:函数组件名称必须以 开头 约定2:函数组件必须有返回值 表示该组件的结构 如果返回值为null 表示不渲染任何内容 2.1使 ...