HTML是英文HyperText Markup Language的缩写，即超级文本标记语言，是用于描述网页文档的一种标记语言。
HTMl是目前网络上应用最为广泛的语言，也是构成网页文档的主要语言。HTML命令可以说明文字、图形、动画、声音、表格、链接等。
HTML的注释方法 ：<!-- html注释 -->
CSS的注释方法：/* css注释*/
JS的注释方法：// js的单行注释方式 /* js的多行注释方式*/

一. HTML概述

<!DOCTYPE html>
<html>
　　<head>
　　<title></title>
　　<meta charset="utf-8">
</head>
<body>

<h1>标题标签</h1>
<h2>加粗换行</h2>
<h3>字号大小改变</h3>
<h4>我是越来越小的</h4>
<h5>我是越来越小的</h5>
<h6>我是越来越小的</h6>

</body>
</html>

二. HTML页面标签

标题是通过 <h1>-<h6> ，自带换行

这些元素实现的效果都是可以叠加的。

空格：不换行单个空格 &nbsp;，两个普通空格的宽度 &ensp;四个普通空格的宽度 &emsp;
换行标记<br/>，文档中插入一个简单的换行符，标记后的内容会换至下一行编辑。
水平分隔线标记<hr/>，标签在 HTML 页面中创建一条水平线。
段落标记标记<p>...</p>，在标记对中的内容会显示在一个段落里。利用此标记可以对网页中的文字进行段落的结构定义，但不能进行段落格式的定义。
加粗标记<b>...</b>，浏览器将包含其中的文本加粗显示。
强调加粗<strong>...</strong>，浏览器把其中的文本用于强调文本，但它强调的程度更强一些。
下划线标记<u>...</u>，浏览器将包含其中的文本添加下划线。
斜体标记<i>...</i>，浏览器将包含其中的文本以斜体字或者倾斜字体显示。
强调斜体标记<em>...</em>，浏览器把其中的文本表示为强调的内容。
删除线标记<del>...</del>，浏览器将定义文档中已被删除的文本。
下标标记<sub>...</sub>,标记对中的内容将会以当前文本流中字符高度的一半来显示，但是与当9.前文本流中文字的字体和字号都是一样的

三. HTML列表

1. 有序列表 ol

<ol type=" " start=" "> #type可选择 1，，a，，A，，i，，I，，
  <li>列表内容</li>
  <li>列表内容</li>
</ol>

2.无序列表，ul标记符也包含一个常用的

<ul type="square"> #type属性有，disc实心圆点，，circle空心圆圈，，square方形
<li>列表内容</li>
<li>列表知识</li>
<li>列表介绍</li>
</ul>

3.自定义列表 以<dl>标记开始，列表的解释以<dd>开始，列表项目以<dt>开始，。<dd>标记只能用在<dl>标记中使用

<dl>
<dd>列表解释</dd>
<dt>列表项目列表项目</dt>
<dt>列表项目列表项目</dt>
</dl>

四. HTML超链接

<a href="url" target="target-windows">链接标题</a>
target属性指定用于打开链接的目标窗口，默认原窗口，可选blank 在新窗口打开。。

1、内部链接

将href属性的URL值设置为相对路径，即可。

2、外部链接

链接到网站外部的文件，将href属性设置为绝对路径 即可。<a href="https://www.baidu.com/" target="_blank">点击去百度</a>

3、书签链接 在两个a标签形成的链接，目标位置a的 href为空 有个name=“ ”属性，触发位置的a中href=“name值”，，这就ok了

触发点： <a href="#a1" >跳到第一块</a>
<br/>
目标位置：<a href="" name="a1">第一块</a>

五. HTML图片标签

<img src="url" alt="替代文" width="value" height="value" border=“” title=“”/>

#src属性为必须属性，其他属性为可选项。title：鼠标移上时显示的说明文。

<img>标记并不是在网页中插入图像，而是从网页上链接显示一幅图像。也可以使CSS设置某元素的背景图像。

例如：<img src="./58e6e7f6N3407445f.jpg" alt="华为p10" border="5" title="华为p10">

六. HTML Form表单

<form name="formName" method="post/get" action="url" > 内容包括下面的所有input项 </form>

其中：name表单名称，，method表单发送方式，，action表单处理程序提交地址。。

<input type="控件类型" name="控件名称"/>

其中：type属性设置控件的类型，可以是text文本框、password密码框、button标准按钮、checkBox复选框、radio单选按钮、file文件筐、reset重置按钮、image图像域、submit提交按钮等。

<form method="post" action="index.php">

文本框:  <input type="text" name="username" placeholder="请输入…" minlennght="6" maxlength="12" readonly/> <br/> #最后的也可disabled
密码框:  <input type="password" name="pass" placeholder="请输入密码！"/> <br/>
普通按钮: <input type="button" value="普通按钮"> <br/>
复选框:  篮球<input type="checkbox">足球<input type="checkbox">乒乓球<input type="checkbox"> <br/>
单选框:  男<input type="radio" name="ra">女<input type="radio" name="ra"> <br/> <!--name的名称相同才能够有单选的效果-->
文件框:  <input type="file" name="file" /> <br/>
重置按钮: <input type="reset" value="重置"> <br/>
图像框:  <input type="image" src="./image/forget.gif" width="" height=""> <br/>
提交按钮:  <input type="submit" value="注册">

下拉列表框：<select>

<option>北京</option> #列表项标记
<option>上海</option>
<option>广州</option>
<option>深圳</option>
</select> <br/>

文本域：<br/> <textarea rows="5" cols="10"> </textarea>

</form>

******** ps：输入框提示信息除了密码都可以用value，密码框要用placeholder

HTML基础：的更多相关文章

  1. java基础集合经典训练题

    第一题:要求产生10个随机的字符串,每一个字符串互相不重复,每一个字符串中组成的字符(a-zA-Z0-9)也不相同,每个字符串长度为10; 分析:*1.看到这个题目,或许你脑海中会想到很多方法,比如判 ...

  2. node-webkit 环境搭建与基础demo

    首先去github上面下载(地址),具体更具自己的系统,我的是windows,这里只给出windows的做法 下载windows x64版本 下载之后解压,得到以下东西 为了方便,我们直接在这个目录中 ...

  3. js学习笔记：webpack基础入门（一）

    之前听说过webpack,今天想正式的接触一下,先跟着webpack的官方用户指南走: 在这里有: 如何安装webpack 如何使用webpack 如何使用loader 如何使用webpack的开发者 ...

  4. Golang， 以17个简短代码片段，切底弄懂 channel 基础

    (原创出处为本博客:http://www.cnblogs.com/linguanh/) 前序: 因为打算自己搞个基于Golang的IM服务器,所以复习了下之前一直没怎么使用的协程.管道等高并发编程知识 ...

  5. [C#] C# 基础回顾 - 匿名方法

    C# 基础回顾 - 匿名方法 目录 简介 匿名方法的参数使用范围 委托示例 简介 在 C# 2.0 之前的版本中,我们创建委托的唯一形式 -- 命名方法. 而 C# 2.0 -- 引进了匿名方法,在 ...

  6. HTTPS 互联网世界的安全基础

    近一年公司在努力推进全站的 HTTPS 化,作为负责应用系统的我们,在配合这个趋势的过程中,顺便也就想去搞清楚 HTTP 后面的这个 S 到底是个什么含义?有什么作用?带来了哪些影响?毕竟以前也就只是 ...

  7. Swift与C#的基础语法比较

    背景: 这两天不小心看了一下Swift的基础语法,感觉既然看了,还是写一下笔记,留个痕迹~ 总体而言,感觉Swift是一种前后端多种语言混合的产物~~~ 做为一名.NET阵营人士,少少多多总喜欢通过对 ...

  8. .NetCore MVC中的路由（1）路由配置基础

    .NetCore MVC中的路由(1)路由配置基础 0x00 路由在MVC中起到的作用 前段时间一直忙于别的事情,终于搞定了继续学习.NetCore.这次学习的主题是MVC中的路由.路由是所有MVC框 ...

  9. .NET基础拾遗（5）多线程开发基础

    Index : (1)类型语法.内存管理和垃圾回收基础 (2)面向对象的实现和异常的处理基础 (3)字符串.集合与流 (4)委托.事件.反射与特性 (5)多线程开发基础 (6)ADO.NET与数据库开 ...

  10. .NET 基础 一步步 一幕幕[面向对象之方法、方法的重载、方法的重写、方法的递归]

    方法.方法的重载.方法的重写.方法的递归 方法: 将一堆代码进行重用的一种机制. 语法: [访问修饰符] 返回类型 <方法名>(参数列表){ 方法主体: } 返回值类型:如果不需要写返回值 ...

随机推荐

  1. 【leetcode刷题笔记】Add Binary

    Given two binary strings, return their sum (also a binary string). For example,a = "11"b = ...

  2. 20145229吴姗珊 《Java程序设计》第5周学习总结

    20145229吴姗珊 <Java程序设计>第5周学习总结 教材学习内容总结 第八章 异常处理 1.设计错误对象都继承自java.lang.Throwable类 2.Java中所有错误都会 ...

  3. 20145229吴姗珊《Java程序设计》第二周学习总结

    教材学习内容总结 一.类型.变量与运算符 1.类型 整数:可细分为short整数.int整数和long整数.不同长度的整数可储存的整数范围也不同. 字节:byte类型顾名思义.长度就是一字节,需要逐字 ...

  4. Outlook 2010打开没反应，只有任务栏有图标的解决方法

    Outlook 2010打开没反应,任务栏图标显示如下: 解决方法: 按下Windows+R键,输入regedit: 按回车: 请在注册表编辑器中定位到以下键值,重命名以下4项(比如将outlook重 ...

  5. php设计模式课程---6、策略模式如何使用

    php设计模式课程---6.策略模式如何使用 一.总结 一句话总结:比如代码需求,做一饭店,有南北方不同菜系,不同分店有不同的饭菜汤的需求,代码怎么设计 从饭店有特色过渡到厨师有特色(南方厨师(南方饭 ...

  6. Tstrings类简单介绍及实例

    用TStrings保存文件;var  S: TStrings;begin  S := TStringList.Create();  { ... }  S.SaveToFile('config.txt' ...

  7. shingling算法——提取特征，m个hash函数做指纹计算，针对特征hash后变成m维向量，最后利用union-find算法计算相似性

    shingling算法用于计算两个文档的相似度,例如,用于网页去重.维基百科对w-shingling的定义如下: In natural language processing a w-shinglin ...

  8. C#子线程执行完后通知主线程

    其实这个比较简单,子线程怎么通知主线程,就是让子线程做完了自己的事儿就去干主线程的转回去干主线程的事儿. 那么怎么让子线程去做主线程的事儿呢,我们只需要把主线程的方法传递给子线程就行了,那么传递方法就 ...

  9. xdebug浏览器调试参数

    XDEBUG_SESSION_START=phpstorm-xdebug 找到对应PHP版本的 Xdebug ,后面带 TS 的为线程安全,本机环境为 win7 64 + php-5.5.1-Win3 ...

  10. Excel文本获取拼音

    [说明] 版本:Excel 2010 文件后缀:.xls 有在.xlsb文件下使用未成功.建议使用.xls后缀. 1.调出“开发工具” 步骤:文件-->选项-->自定义功能区-->勾 ...