HTML学习笔记NO.1

HTML:

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

超文本标记语言Hyper Text Markup Language

不是编程语言,是一种标记语言

新特性:

用于绘画的canvas标签

用于媒介回放的video和audio元素->视音频文件

对本地离线存储的更好支持

新的元素内容:如article、footer、header、nav、section

新的表单控件:如:calender、date、time、email、url、search

浏览器的支持:chrome、firefox以及Opera和IE9

开发工具:

常用:WebStorm、notepad++、Eclipse、text sublime、Dreamweaver等

推荐:Intellij IDEA

需要掌握的技能:

HTML5 XHTML CSS3 JavaScript jQuery:jQuery-Ui jQuery-Mobile

HTML基础讲解:

声明:<!DOCTYPE>

html也有多个不同的版本,只有完全明白页面中使用的确切HTML版本,浏览器才能完全正确

地显示出HTML页面。这就是<!DOCTYPE>的用处

不同版本的HTML有不同的HTML声明

到HTML5直接使用:<!DOCTYPE html>

常用标签属性:

<h1>:align对齐方式

<body>:bgcolor背景颜色

<a>:target规定在何处打开连接

通用属性:

class : 规定元素的类名

id    : 规定元素唯一ID

style : 规定元素的样式

title : 规定元素的额外信息

格式化:

<b>粗体文本

<big>大号字------html5过时通常使用css来代替

<em>着重文字

<i>斜体字

<small>小号字

<strong>加重语气

<sub>下标字

<sup>上标字

<ins>定义插入字

<del>定义删除字

HTML5样式、连接和表格

标签:

<style>样式定义

<link>资源引用----如引入CSS样式

属性:

rel="stylesheet":外部样式表

type="text/CSS":引入文档的类型

margin-left:边距----距离左边或者右边的距离

三种样式表插入方法:

外部样式表:reference link ->rel http refernece link ->href

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

内部样式表:

<style type="text/css">

body{background-color:red}

p{margin-left:20px}

</style>

内联样式表:

<p style="color:red">

连接属性及其使用:

1、连接数据:

文本连接

图片连接

2、属性:

href属性:指向另一个文档的连接

name属性:创建文档的连接

3、imag标签属性:

alt:替换文本属性

width:宽

height:高

HTML表格

<table>定义表格

<caption>表格标题

<th>表格的表头

<tr>表格的行

<td>表格的单元

<thead>表格的页眉

<tbody>表格的主体

<tfoot>表格的页脚

<col>表格的列属性

HTML列表:

<ol>有序列表

<ul>无序列表

<li>列表项

<dl>列表

<dt>列表项

<dd>描述

无序列表使用标签:<ul>、<li>

属性:disc、circle、square

有序列表使用标签:<ol>、<li>

属性:A、a、I、i、start

嵌套列表使用标签:<dl>、<dt>、<dd>

HTML块:

块元素:

块元素在显示时,通常会以新行开始,如:<hl> <p> <ul>

内联元素:

内联元素通常不会以新行开始,如:<b> <a> <imag>

<div>元素:也被成为块元素,其主要是组合HTML元素的容器

<span>元素:是内联元素,可作为文本的容器

HTML布局:

div或者table来进行布局

HTML表单:

表单用于获取不同类型的用户输入

常用标签:

<form> 表单

<input> 输入域

<textarea>文本域

<label>控制标签

<fieldset>定义域

<legend>域的标题

<select>选择列表

<optgroup>选项组

<option>下拉列表中的选项

<button>按钮

时间: 2024-07-30 03:50:14

HTML学习笔记NO.1的相关文章

vector 学习笔记

vector 使用练习: /**************************************** * File Name: vector.cpp * Author: sky0917 * Created Time: 2014年04月27日 11:07:33 ****************************************/ #include <iostream> #include <vector> using namespace std; int main

Caliburn.Micro学习笔记(一)----引导类和命名匹配规则

Caliburn.Micro学习笔记(一)----引导类和命名匹配规则 用了几天时间看了一下开源框架Caliburn.Micro 这是他源码的地址http://caliburnmicro.codeplex.com/ 文档也写的很详细,自己在看它的文档和代码时写了一些demo和笔记,还有它实现的原理记录一下 学习Caliburn.Micro要有MEF和MVVM的基础 先说一下他的命名规则和引导类 以后我会把Caliburn.Micro的 Actions IResult,IHandle ICondu

jQuery学习笔记(一):入门

jQuery学习笔记(一):入门 一.JQuery是什么 JQuery是什么?始终是萦绕在我心中的一个问题: 借鉴网上同学们的总结,可以从以下几个方面观察. 不使用JQuery时获取DOM文本的操作如下: 1 document.getElementById('info').value = 'Hello World!'; 使用JQuery时获取DOM文本操作如下: 1 $('#info').val('Hello World!'); 嗯,可以看出,使用JQuery的优势之一是可以使代码更加简练,使开

[原创]java WEB学习笔记93:Hibernate学习之路---Hibernate 缓存介绍,缓存级别,使用二级缓存的情况,二级缓存的架构集合缓存,二级缓存的并发策略,实现步骤,集合缓存,查询缓存,时间戳缓存

本博客的目的:①总结自己的学习过程,相当于学习笔记 ②将自己的经验分享给大家,相互学习,互相交流,不可商用 内容难免出现问题,欢迎指正,交流,探讨,可以留言,也可以通过以下方式联系. 本人互联网技术爱好者,互联网技术发烧友 微博:伊直都在0221 QQ:951226918 -----------------------------------------------------------------------------------------------------------------

Activiti 学习笔记记录(三)

上一篇:Activiti 学习笔记记录(二) 导读:上一篇学习了bpmn 画图的常用图形标记.那如何用它们组成一个可用文件呢? 我们知道 bpmn 其实是一个xml 文件

HTML&CSS基础学习笔记8-预格式文本

<pre>标签的主要作用是预格式化文本.被包围在 pre 标签中的文本通常会保留空格和换行符.而文本也会呈现为等宽字体. <pre>标签的一个常见应用就是用来表示计算机的源代码.当然你也可以在你需要在网页中预显示格式时使用它. 会使你的文本换行的标签(例如<h>.<p>)绝不能包含在 <pre> 所定义的块里.尽管有些浏览器会把段落结束标签解释为简单地换行,但是这种行为在所有浏览器上并不都是一样的. 更多学习内容,就在码芽网http://www.

java/android 设计模式学习笔记(14)---外观模式

这篇博客来介绍外观模式(Facade Pattern),外观模式也称为门面模式,它在开发过程中运用频率非常高,尤其是第三方 SDK 基本很大概率都会使用外观模式.通过一个外观类使得整个子系统只有一个统一的高层的接口,这样能够降低用户的使用成本,也对用户屏蔽了很多实现细节.当然,在我们的开发过程中,外观模式也是我们封装 API 的常用手段,例如网络模块.ImageLoader 模块等.其实我们在开发过程中可能已经使用过很多次外观模式,只是没有从理论层面去了解它. 转载请注明出处:http://bl

[原创]java WEB学习笔记48:其他的Servlet 监听器:域对象中属性的变更的事件监听器 (3 个),感知 Session 绑定的事件监听器(2个)

本博客为原创:综合 尚硅谷(http://www.atguigu.com)的系统教程(深表感谢)和 网络上的现有资源(博客,文档,图书等),资源的出处我会标明 本博客的目的:①总结自己的学习过程,相当于学习笔记 ②将自己的经验分享给大家,相互学习,互相交流,不可商用 内容难免出现问题,欢迎指正,交流,探讨,可以留言,也可以通过以下方式联系. 本人互联网技术爱好者,互联网技术发烧友 微博:伊直都在0221 QQ:951226918 ---------------------------------

java/android 设计模式学习笔记(10)---建造者模式

这篇博客我们来介绍一下建造者模式(Builder Pattern),建造者模式又被称为生成器模式,是创造性模式之一,与工厂方法模式和抽象工厂模式不同,后两者的目的是为了实现多态性,而 Builder 模式的目的则是为了将对象的构建与展示分离.Builder 模式是一步一步创建一个复杂对象的创建型模式,它允许用户在不知道内部构建细节的情况下,可以更精细地控制对象的构造流程.一个复杂的对象有大量的组成部分,比如汽车它有车轮.方向盘.发动机.以及各种各样的小零件,要将这些部件装配成一辆汽车,这个装配过

[原创]java WEB学习笔记12:一个简单的serlet连接数据库实验

本博客为原创:综合 尚硅谷(http://www.atguigu.com)的系统教程(深表感谢)和 网络上的现有资源(博客,文档,图书等),资源的出处我会标明 本博客的目的:①总结自己的学习过程,相当于学习笔记 ②将自己的经验分享给大家,相互学习,互相交流,不可商用 内容难免出现问题,欢迎指正,交流,探讨,可以留言,也可以通过以下方式联系. 本人互联网技术爱好者,互联网技术发烧友 微博:伊直都在0221 QQ:951226918 ---------------------------------