几个知识点:  

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

HTML框架结构:

<!DOCTYPE html>

<html>

<head>

</head>

<body>

此处为标签内容

</body>

</html>

HTML属性:

class=“XXX”  :元素类名,CSS定位用

id=“XXX”  :元素id,CSS定位用

style=“XXX”:定于元素颜色、是否居中、粗细、边界等

title=“XXX”:鼠标悬停时提示信息

Alt=“XXX”:图片加载错误提示信息

HTML常用标签:

<h1 align=“center”>文字内容</h1>:标题居中显示

<p style="font-size:10px“>文字内容</p>:段落显示

<a href=“https://www.baidu.com/” title=“这是链接“>百度</a>:链接标签

<img src=“./picture.jpg” alt="图片加载错误"/>:图片显示标签

一些独立标签:

<br/>:换行

<hr/>:创建水平线

<!– 注释内容-->:注释

&nbsp;显示空格(一种HTML实体符号)

<div>此处可嵌套其他标签</div>:块级元素,他的内容会另起一行开始。

<span>此处可嵌套其他标签</span>:内联元素,不换行

无序列表:

<ul>

<li>第一项</li>

<li>第二项</li>

</ul>

有序列表:

<ol>

<li>第一项</li>

<li>第二项</li>

</ol>

表格:

<table border="1">

<tr>

<td rowspan="2">跨行</td>

<td>row 1, cell 1</td>

<td>row 1, cell 2</td>

</tr>

<tr>

<td>row 2, cell 1</td>

<td>row 2, cell 2</td>

</tr>

</table>

运行样式如下:

表格的一些属性:

表单:

表单是一个包含表单元素的区域,表单元素是允许用户在表单中(比如:文本域、下拉列表、单选框、复选框等等)输入信息的元素

<form>表单元素</form>:表单标签

<textarea></textarea>:文本域,可输入文字

<input type=“text” name=“firstname” />:输入框元素

<input type=“radio” name=“sex”/>:单选按钮元素

<input type=“checkbox” name=“car” />:复选按钮

<select name=“cars”>:下拉列表

<option value="volvo">Volvo</option>

<option value="fiat" selected="selected">Fiat</option>

</select>

<button type=“button”>Click Me!</button>:按钮

<input type=“submit” value=“Submit” />:提交按钮

HTML一些高级特性:

<frameset cols="25%,75%">

<frame src="./frame_a.htm">

<frame src="./frame_b.htm">

</frameset>  框架,将屏幕分为两半,分别填充两个页面

<iframe src=“https://www.baidu.com/”></iframe>:内联框架,将一个页面内联

<link rel=“stylesheet” type=“text/css” href=“theme.css” />:外部文件引入,放在head标签内

<title></title>:定义文档的标题,位于head内

<meta></meta>:定义关键字、文档描述,位于文档head之内

<base href=“https://www.baidu.com/” />:定义整篇文档的默认链接指向

<script></script>:插入script语句

HTML完整例子如下:

<html>
<head>
<link rel="stylesheet" type="text/css" href="theme.css" />
<meta name="description" content="Free Web tutorials on HTML, CSS, XML" />
<meta name="keywords" content="HTML, CSS, XML" />
<base href="https://www.baidu.com/" />
<base target="_blank" />
</head>
<body>
<h1 align="center">标题1</h1>
<p style="font-size:10px" >黄色段落</p>
<a href="https://www.baidu.com/" title="这是链接">百度</a>
<img src="./picture.jpg" alt="图片加载错误"/> <div class="news">
<h2>News headline 1</h2>
<p>some text. some text. some text...</p>
...
</div>
<span>提示:</span> <table border="1">
<tr>
<td rowspan="2">跨行</td>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table> <ul>
<li>第一项</li>
<li>第二项</li>
</ul>
<ol>
<li>第一项</li>
<li>第二项</li>
</ol> <form name="input" action="html_form_action.asp" method="get">
<textarea rows="10" cols="5">文本域</textarea>
姓名:<input type="text" name="firstname"/>
<input type="radio" name="sex"/>男性
<input type="checkbox" name="car" />我有汽车
<button type="button">Click Me!</button> <select name="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="fiat" selected="selected">Fiat</option>
<option value="audi">Audi</option>
</select>
<input type="submit" value="Submit" /> </form> <frameset cols="75%,25%">
<frame src="./frame_a.htm">
<frame src="./frame_b.htm">
</frameset> <iframe src="https://www.baidu.com/"></iframe>
</body>
</html>

  

随机推荐

  1. C# 发送Http请求 - WebClient类

    WebClient位于System.Net命名空间下,通过这个类可以方便的创建Http请求并获取返回内容. 一.用法1 - DownloadData string uri = "http:/ ...

  2. Hibernate框架与Mybatis框架的对比

    学习了Hibernate和Mybatis,但是一直不太清楚他们两者的区别的联系,今天在网上翻了翻,就做了一下总结,希望对大家有帮助! 原文:http://blog.csdn.net/firejuly/ ...

  3. Spring框架IOC容器和AOP解析

    主要分析点: 一.Spring开源框架的简介  二.Spring下IOC容器和DI(依赖注入Dependency injection) 三.Spring下面向切面编程(AOP)和事务管理配置  一.S ...

  4. gulp压缩css文件跟js文件

    越到最后啊 就越发现,真的很理解那句话 就是自己多学一点一点知识,就少一句问别人的东西 这是多么痛苦的领悟 今天需要压缩css跟js文件 然后不懂啊 就问别人啊 就问啊问啊 然后再上网了解啊了解啊 用 ...

  5. jQuery 购物车鼠标经过出现下拉框的做法

    这一段时间在学习web前端,最近学了jQuery库,深感其强大,下面通过写购物车的下拉框做法,把自己的理解和大家交流一下,欢迎各位大神指点指正,废话不多说,开始正题: 购物车html: <!-- ...

  6. SharePoint 2016 图文安装教程

    前言 SharePoint 2016如约而至,之前也装过预览版,但是这次是正式版,还是分享一个完整的安装过程给大家,希望能给有需要的人有所帮助. 1.首先安装操作系统,我这里是Windows Serv ...

  7. Objective-C 快速入门--基础(三)

    1.OC有几种方式创建字符串对象?如:如何创建一个字符串对象:@“Baby”. OC中有3种方式创建字符串对象: 示例:main.m文件中: 控制台输出: 2.OC中如何获取字符串的长度? OC中获取 ...

  8. Android 异步任务,通过PHP访问数据库,多线程,线程间通讯

    文章列表MainActivity.java package com.eric.asynctask; import java.io.IOException; import java.util.Array ...

  9. 对象映射工具AutoMapper介绍

    AutoMapper是用来解决对象之间映射转换的类库.对于我们开发人员来说,写对象之间互相转换的代码是一件极其浪费生命的事情,AutoMapper能够帮助我们节省不少时间. 一. AutoMapper ...

  10. C#委托的介绍(delegate、Action、Func、predicate) --转载

    来源:http://www.cnblogs.com/akwwl/p/3232679.html 委托是一个类,它定义了方法的类型,使得可以将方法当作另一个方法的参数来进行传递.事件是一种特殊的委托. 1 ...