1.什么是HTML

　　> HTML是用来描述网页的一种语言

　　> HTML指的是超文本标记语言(Hyper Text Markup Language)

　　> 标记语言是一套标记标签(markup tag)

　　> HTML 使用标记标签来描述网页

2.HTML元素

　　> 元素=标签<a>+属性<id,name,class...>+元素文本内容

3.HTML结构

　　> 一个html是无数个元素组成

　　> 一个html包括head和body两个部分,即头和体部分.head中定义js.csss,body中定义页面显示的主体内容.

4.HTML基本元素

> 文本输入框: <input type="text" value="文本输入框">

文本输入框：<input type="text" value="test"><br>

> 选择框 ：<input type="checkbox">

爱好：<input type="checkbox">体育<input type="checkbox">美术<input type="checkbox">音乐<br>

> 单选按钮<input type="radio">    //>复选按钮去掉name属性,即可多选

性别：<input type="radio" name="sax">男<input type="radio" name="sax">女

> 按钮 <input type="button">

<input type="button" value="提交">&nbsp;&nbsp;<input type="button" value="返回">

> 文件上传：<input type="file">

文件上传：<input type="file">

> 密码输入框

密码：<input type="password">

> 下拉选 <select><option></option></select>

    <select>

        <option>请选择</option>

        <option>山西省</option>

        <option>山东省</option>

    </select>省

> 超链接

<a href="https://www.baidu.com/">百度链接</a>                 <!-- 原标签内打开 -->

<a href="https://www.baidu.com/" target="_blank">百度链接</a> <!--target="_blank" 新打开一个标签网页 -->

> 表格

<form action="">

    <table border="2px">

        <tr><td>语文</td><td>数学</td><td>历史</td></tr>

        <tr><td>英语</td><td>体育</td><td>地理</td></tr>

    </table>

</form>

> 图片

<!-- 图片  src="本地图片地址"-->
<img src="C:\Users\Administrator\Desktop\test\微信截图_20181023091515.png"/>

> 有序列表/无序列表

<!-- 有序列表-->

<ol>

    <li>第一列</li>

    <li>第二列</li>

    <li>第三列</li>

</ol>

<!-- 无序列表-->

<ul>

    <li>第一列</li>

    <li>第二列</li>

    <li>第三列</li>

</ul>

> 文本域

<!-- 文本域 -->

备注：<textarea rows="" cols=""></textarea>

> iframe:内联框架,可以实现页面嵌套另一个页面

<!-- iframe -->

<iframe src="https://www.baidu.com/" width="300" height="200"></iframe>

5.扩展：HTML+CSS样式(颜色选择十六进制值参考:https://www.runoob.com/cssref/css-colorsfull.html)

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>HTML+CSS</title>

<style type="text/css">

    div{border: 1px solid red;width: 500px;height: 20px;background-color: gray;}

    .cls{border: 3px solid green;width: 500px;height: 20px;background-color:white;}

    #id1{border: 5px solid black;width: 500px;height: 20px;background-color:white;}

</style>

</head>

<body>

        <!-- HTML+CSS样式 --><br>

        <div> </div><br>

        <div class="cls"> </div><br>

        <div id="id1"> </div><br>

</body>

</html>

6.学习后总结，分享给需要的人，不足之处后续补充修改！

HTML 简单介绍的更多相关文章

  1. [原创]关于mybatis中一级缓存和二级缓存的简单介绍

    关于mybatis中一级缓存和二级缓存的简单介绍 mybatis的一级缓存: MyBatis会在表示会话的SqlSession对象中建立一个简单的缓存,将每次查询到的结果结果缓存起来,当下次查询的时候 ...

  2. 利用Python进行数据分析(7) pandas基础: Series和DataFrame的简单介绍

    一.pandas 是什么 pandas 是基于 NumPy 的一个 Python 数据分析包,主要目的是为了数据分析.它提供了大量高级的数据结构和对数据处理的方法. pandas 有两个主要的数据结构 ...

  3. 利用Python进行数据分析(4) NumPy基础: ndarray简单介绍

    一.NumPy 是什么 NumPy 是 Python 科学计算的基础包,它专为进行严格的数字处理而产生.在之前的随笔里已有更加详细的介绍,这里不再赘述. 利用 Python 进行数据分析(一)简单介绍 ...

  4. yii2的权限管理系统RBAC简单介绍

    这里有几个概念 权限: 指用户是否可以执行哪些操作,如:编辑.发布.查看回帖 角色 比如:VIP用户组, 高级会员组,中级会员组,初级会员组 VIP用户组:发帖.回帖.删帖.浏览权限 高级会员组:发帖 ...

  5. angular1.x的简单介绍(二)

    首先还是要强调一下DI,DI(Denpendency Injection)伸手获得,主要解决模块间的耦合关系.那么模块是又什么组成的呢?在我看来,模块的最小单位是类,多个类的组合就是模块.关于在根模块 ...

  6. Linux的简单介绍和常用命令的介绍

    Linux的简单介绍和常用命令的介绍 本说明以Ubuntu系统为例 Ubuntu系统的安装自行百度,或者参考http://www.cnblogs.com/CoderJYF/p/6091068.html ...

  7. iOS-iOS开发简单介绍

    概览 终于到了真正接触IOS应用程序的时刻了,之前我们花了很多时间去讨论C语言.ObjC等知识,对于很多朋友而言开发IOS第一天就想直接看到成果,看到可以运行的IOS程序.但是这里我想强调一下,前面的 ...

  8. iOS开发多线程篇—多线程简单介绍

    iOS开发多线程篇—多线程简单介绍 一.进程和线程 1.什么是进程 进程是指在系统中正在运行的一个应用程序 每个进程之间是独立的,每个进程均运行在其专用且受保护的内存空间内 比如同时打开QQ.Xcod ...

  9. iOS开发UI篇—UITabBarController简单介绍

    iOS开发UI篇—UITabBarController简单介绍 一.简单介绍 UITabBarController和UINavigationController类似,UITabBarControlle ...

  10. Android开发自学笔记(Android Studio)—4.界面编程与View组件简单介绍

    一.引言 Android应用开发最重要的一份内容就是界面的开发,无论你程序包含的内容多么优秀,如若没有一个良好的用户交互界面,最终也只是会被用户所遗弃.Android SDK提供了大量功能丰富的UI组 ...

随机推荐

  1. Elasticsearch -head 查询报 406错误码

    问题:利用Elasticsearch -head插件不能查看数据或者在Elasticsearch -linux的curl命令操作时总是提示: {"error":"Cont ...

  2. 学习laravel总结中...

    1,安装homestead :mac环境 https://learnku.com/docs/laravel-development-environment/5.5/development-enviro ...

  3. three.js 模型拖动之DragControls控制器

    需求: 拖动场景内的模型 方案: 增加控制器DragControls 1.引入控制器 import { OrbitControls } from "three/examples/jsm/co ...

  4. CF786C-Till I Collapse【树状数组倍增,优先队列】

    正题 题目链接:https://www.luogu.com.cn/problem/CF786C 题目大意 给出一个长度为\(n\)的序列. 对于每个\(k\in[1,n]\)求将\(n\)分成最少的段 ...

  5. P3288-[SCOI2014]方伯伯运椰子【0/1分数规划,负环】

    正题 题目链接:https://www.luogu.com.cn/problem/P3288 题目大意 给出\(n\)个点\(m\)条边的一张图,没条边\(i\)流量为\(c_i\),费用是\(d_i ...

  6. asp.net core 中配合响应 html5 的音视频播放流，以及文件下载

    一.asp.net core 中配合响应 html5 的音视频播放流,以及文件下载 问题描述: 目前测试了在 Windows(谷歌浏览器).Android(系统浏览器.QQ.微信).iOS 三个系统不 ...

  7. DOC命令和批处理命令

    本文章以极简的方式展现,相信能够浏览到这篇文章的人都对批命令有了一定的了解,我不会把文章写的长篇大论 重要!!! (命令/?)查看帮助文档 (命令/help)查看详细帮助文档 附:思维导图 批处理编程 ...

  8. Win32对话框模板创建的窗口上响应键消息,Tab焦点切换消息,加速键消息

    今天在学习的时候,发现对话框上不响应键盘消息,查了老半天,终于成功了,现分享出来, 1,首先要在消息循环的时候加如下代码. int WINAPI WinMain(_In_ HINSTANCE hIns ...

  9. iOS平台 | 快速集成华为AGC认证服务

    介绍 如何让用户根据已有的账号来进行登录注册呢?在应用中集成华为AGC认证服务SDK来轻松快速地实现这个功能. 本篇内容根据官网文档指导集成过程总结完成,关于集成步骤,官网的资料写的有点多,现在我总结 ...

  10. 【UE4】GAMES101 图形学作业4：贝塞尔曲线

    总览 Bézier 曲线是一种用于计算机图形学的参数曲线. 在本次作业中,你需要实现de Casteljau 算法来绘制由4 个控制点表示的Bézier 曲线(当你正确实现该算法时,你可以支持绘制由更 ...