静态Web开发 HTML

静态Web开发

一章 HTML(Hyper Text Markup Language)

1节
html入门

HTML
超文本标记语言
由浏览器解释执行
开发人员编写的超文本文档就是网页

XHTML
HTML升级到XML得过度产品
完全兼容HTML4.01
并且具有XML的语法

不区分大小写
头部分是给HTML页面增加一些辅助或属性信息,它里面的内容会最先加载,体部分是真正存放数据的地方

<head>
<meta http-equiv="Content-type" content="text/html;charset=utf-8"> //该文档采用哪种编码集utf-8
</head>

<font color="red" size="2">能看到我嘛</font> //不指定编码,乱码;标签不区分大小写

可以使用专业的HTML编译器来编译HTML:
Adobe Dreamweaver
Microsoft Expression Web
CoffeeCup HTML Editor
对于初学者,推荐使用文本编译器来学习HTML
Editplus,Notepad++

2节
字体标签

<title></title>
<font color="red" sixe="+2" face="微软雅黑"></font> //size不能指定大小,只能+ -;face指定字体样式;font已经不赞成使用,都是用css

标题标签
<h1></h1>
...
<h6></h6> //六级标签

特殊字符
&lt; <
&gt; >
&nbsp; 空格
&quot; "
&reg; ®
&trade; ™
&amp; &
&copy; ©

常见的单标记标签:<br/> //显示他们需要转移
常见的双标记标签:<front></front>

3节
列表标签

disc :  CSS1 默认值。实心圆
circle :  CSS1 空心圆
square :  CSS1 实心方块
decimal :  CSS1 阿拉伯数字
lower-roman :  CSS1 小写罗马数字
upper-roman :  CSS1 大写罗马数字
lower-alpha :  CSS1 小写英文字母
upper-alpha :  CSS1 大写英文字母   // ul属性中有三个值,用于规定列表的符号,不赞成使用

无序列表
<ul style="list-style-type:disc">
<li>第一</li><li>第二</li><li>第三</li>
</ul>

有序列表

<ol style="list-style-type:upper-alpha">
<li>一</li><li>二</li><li>三</li><li>四</li>
</ol>

定义列表(definition list)
<dl>
<dt>游戏</dt> //definition table
<dd>穿越火线</dd> //description描述
<dd>lol</dd>
<dt>部门</dt>
...
</dl>

4节
图像标签

<img sc="..."
boder="3px" //边框
title="鼠标移到的提示文本"
alt="显示不出来时提示" //不同浏览器的版本可能提示不出来,不能超过1024字符
width="200px"
height="300px"
/>

5节
表格标签------------------------------------------------------------------------------------------------------------------------------(*)

//用于格式化数据
//cellspacing="0px" 单元格与相邻单元格之间的距离;collapse ;cellpadding 单元格内容与边框的距离
<table border width="100%" cellpadding="5px" cellspacing="0px" style="border-collapse:collapse">
<caption>标题</caption>
<thead>
<tr>
<th>编号</th><th>姓名</th><th>年龄</th>
</tr>
</thead>
<tbody> //多个tbody标签,可以局部控制数据的加载,减少等待时间
...
</tbody>
<tfoot> //与tbody是一样的,在表格的尾部新增一行
</tfoot>
<tr>
<td>编号</td><td>姓名</td><td>年龄</td>
</tr>
...
</table>

<td>常用属性
colspan> rowspan ---合并单元格

6节
超链接(hyperLink)

<a href="http://www.rupeng.com" target="_blank">如鹏</a>
target:指定在哪个窗口中打开,有4个值
_blank 在新开的空白窗口窗口中打开链接
_parent:在父级窗口中打开
_self: 在自身页面中打开(默认)
_top: 在整个浏览器的最顶端(前端)打开

时间: 2024-12-10 16:55:51

静态Web开发 HTML的相关文章

如鹏网 静态Web开发 第一章:html

第一章:html 本章主干知识点: 1.最基本的html文件的格式是什么? 2.常用标签:font.列表(ul.ol.li).img 3.表格标签:table.tr.td:表格的合并. 4.超链接.新窗口中打开的超链接.超链接锚点. 5.框架:frameset 6.表单:input(文本.radio.checkbox.隐藏字段.submit):select下拉列表:textarea:label: 7.div和span的区别. -----------------------------------

如鹏网 静态Web开发 第五章:JQuery

课前说明 参考书:<锋利的jQuery> jQuery官网:http://jquery.com jQuery在线API:http://api.jquery.com http://api.jquery.com/api/ (xml文件.) jQuery UI:http://jqueryui.com/ ------------------------------------------- 常见的JavaScript框架库 什么是JavaScript框架库? 普通JavaScript的缺点:每种控件的

如鹏网 静态Web开发 第四章:JSDom

本章主干知识点: 1.<a onclick="f1()"/> document.getElementById("btn1").onclick=function(){} 2.setInterval.setTimeout 3.事件冒泡以及如何阻止事件冒泡: 4.如何动态创建元素和动态添加元素: 5.innerText和innerHTML区别 6.案例:动态加载数据到table中: ---------------------------------------

静态Web开发 DOM

四章 Dom 1节dom中的顶级对象 dom(文档对象模型)js最终是要操作html页面,让html变成DHtml,而操作Html页面就要用到DOMDOM可以吧Html页面模拟成一个对象,如果js只是执行一些计算.循环等操作,而不能操作Html也就失去了它存在的意义 window.onload=function(){ //1 window.fm.btn.onclick=function(){ //window.id 的方式获得元素(如果嵌套很多次,会非常麻烦) alert('大家好!'); }

Web开发入门之基本概念

参阅资料: <Tomcat与Java Web开发技术详解第二版 ----孙卫琴> 传智播客视频笔记 基本概念 1.Web:Web是一种分布式应用架构,旨在共享分布在各个Web服务器中的所有相互链接的信息. 2.Web开发:① 狭义:网页网站开发 ② 广义:服务器端开发 3.Web资源:Web资源分为两种,一种是静态web资源,第二种是动态Web资源.    ①   静态Web资源:是指浏览器能够直接打开的,比如html,css,js.    ②   动态Web资源:是指一些浏览器不能直接打开,

Springboot 系列(五)Spring Boot web 开发之静态资源和模版引擎

前言 Spring Boot 天生的适合 web 应用开发,它可以快速的嵌入 Tomcat, Jetty 或 Netty 用于包含一个 HTTP 服务器.且开发十分简单,只需要引入 web 开发所需的包,然后编写业务代码即可. 自动配置原理? 在进行 web 开发之前让我再来回顾一下自动配置,可以参考系列文章第三篇.Spring Boot 为 Spring MVC 提供了自动配置,添加了如下的功能: 视图解析的支持. 静态资源映射,WebJars 的支持. 转换器 Converter 的支持.

Python之HTTP静态Web服务器开发

众所周知,Http协议是基于Tcp协议的基础上产生的浏览器到服务器的通信协议 ,其根本原理也是通过socket进行通信. 使用HTTP协议通信,需要注意其返回的响应报文格式不能有任何问题. 响应报文,一共包括4个部分,分别是响应行,响应头,空行,响应体,并且每项数据之间必须使用/r/n隔开. 空行是区分响应头和响应体的必要数据,不能省略. HTTP静态Web服务器主要开发思路如下: 1.导入socket模块 2.创建socket对象 3.设置端口复用,解决端口阻塞问题 4.绑定端口及ip 5.设

多线程静态Web服务器开发小试(java)

多线程静态Web服务器(原创)Java版本 克服内存溢出问题采用缓冲式输出 文件一:HttpWebServerOfLcl.java package com.cn.lcl; import java.io.BufferedReader; import java.io.DataInputStream; import java.io.File; import java.io.FileInputStream; import java.io.IOException; import java.io.Input

java web开发阅读笔记:第一章

学习该书前所用推荐书籍<名师讲坛-java开发实战经典> 一web开发前奏 1.1网页发展 首先搞懂. 1.HTTP:超级文本传输协议,是一种通讯协议. 通过这个网络协议WW浏览器与WWW服务器之间的通讯进行规定,并且通过这个协议我们可以浏览网页,通过网页从客户端写入信息,从服务端得到信息.而通常的HTTP消息包括"客户端->服务端"与"服务端->客户端"的消息传送,图解HTTP协议的功能: 是在客户端通过浏览器根据HTTP协议中向服务器端发