标签：*** 应用 客户端 tle 不同 最新版本 添加 第一个 tor
******************Web前端编程**********************************
B/S 架构
前端知识
1. HTML
画一个最简单的网页
2. CSS
美化页面的技术
3. JavaScript
控制行为的
比如鼠标放到菜单栏上的某一点 出现对应的种类
鼠标放到搜索框内 清空搜索框的内容 都是用JavaScript控制的
******************HTML**********************************
学习目标:制作界面美观、符合W3C规范的静态网站
一. 什么是HTML
超文本标记语言(HyperText Markup Language),用来制作 静态网页的 一种标记语言.
最新版本是HTML5,先学习HTML4.01 为学习HTML5打下基础..
二.HTML的基本组成
由标签组成的. 没有分支和循环,比较简单,所以属于标记语言..
标签分两类:
1. 单标记
<br/> 表示回车
<hr/> 水平分隔符
为了符合W3C规范(万维网联盟,一个专门制定Web规范的组织),单标记后面一定要加/,例如<br/>
虽然不写/也能够表示回车,但是不规范..
<标签名/>
2. 双标记
<标签名>
</标签名>
例如:
<html>
</html>
******************永远的HelloWorld**********************************
HTML文档的后缀为 .html或.htm 推荐使用.html
一.编写一个html程序
<html>
<head>
<title>第一个HTML程序</title>
</head>
<body>
Hello,World!!!!
</body>
</html>
二.运行
使用任何一个浏览器 打开就可以了
解释执行 读进来一行翻译一行 浏览器把对应的代码 渲染成不同的效果
**************************如何处理乱码*********************************
在title下面加一个meta标记
text/html 表示响应给客户端的是 文本/html文档
charset 告诉浏览器该文档使用的是utf-8编码,请你(浏览器)给我使用utf-8解码
<html>
<head>
<title>第一个HTML程序</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8"/>
</head>
<body>
Hello,World!!!!
</body>
</html>
**************************常用的编辑工具*********************************
1. EditPlus 和Sublime UltraEdit
2. dreamweaver
维护方便 有拆分功能
3.IDE
MyEclipse、Aptana、
WebStorm JS开发神器
HBuilder H5开发神器 国人编写
**************************常用的标签*********************************
一.文章的标题
<h1>标题名</h1>
h1--h6 h1最大 h6最小
注意: h1-h6只能做文章的标题用, 千万不要使用h1-h6来控制文字的大小,文字的大小使用CSS样式来控制
语义化: 标签是有含义的,例如h1 代表文章的标题 ,浏览器一看到h1就知道它是文章标题
二.换行
<br/>
在源代码中直接敲入回车,浏览器并不会出现换行的效果,如果想换行,必须要使用br标签
你好<br/>
世界<br/>
123
break
三.设置段落
<p>内容1</p>
<p>内容2</p>
<p>内容3</p>
每一段开头并没有另起两个字符的效果, 每段中间用一行分割开
paragraph
四.设置水平分割线
<hr/>
horizontal 水平的
五.添加图片
<img src="图片的位置"/>
<img src="11111111.jpg" alt="图片2" title="图片2"/>
alt和tile的两个作用:
1. 显示鼠标悬停文字
2. 如果图片不存在 以alt和title中的文字 代替
六.HTML注释
<!-- 注释内容 -->
不会出现任何效果,但是查看源代码的时候会看到注释内容
七.超链接
<a href="http://www.baidu.com">百度</a>
超链接的分类
1. 绝对链接
(1) http://www.baidu.com 绝对指向了某个网址
(2)/ 开头 代表指向应用程序的根路径
2. 相对链接
(1) 访问同级目录
直接写文件名
(2) 访问子级目录
/ 表示进入到该目录
(3) 访问上一级目录
../ 表示后退一步
小技巧: 可以画出目录结构图方便理清思路,如果实在不想换 点一下后退 就敲一个../ 肯定不会出错
***********************************转译字符**********************************
空格
标签：*** 应用 客户端 tle 不同 最新版本 添加 第一个 tor
原文地址：https://www.cnblogs.com/MrTanJunCai/p/9907525.html
