html.day01
1.web标准:
1. 结构 (xhtml) 2. 表现(css) 3.行为(js)
html 超文本标记语言
xhtml (严格型超文本标记语言)
2.规范:
1. 所有标签(标记)都要放到< > 之内 例如:<b>
2. 所有的标记必须闭合。(不一定成对) 其中 / (关闭符号)
例如:<b> </b> <div> </div> <br />
3.必须使用<!DOCTYPE>标记进行文档类型声明
4.区分大小写
3.网页架构 (主题结构 网页骨架)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>网页骨架</title>
</head>
<body> </body>
</html>
4.网页开发工具
记事本 dreamweaver adobe sublime editplus
5.DW 简介
1.调整代码大小
ctrl+u (编辑--首选参数)--- 字体--代码视图
2.dw自动补充代码
ctrl+u-- 代码提示--键入起始标签”>” 后
3.ctrl+t 环绕标签 输入回车即可
6.常用标签
1.dtd 是什么: 文档类型定义
Strict(严格类型) 必须使用干净的标签 <br>
Transitional(过渡类型)
Frameset(框架类型)
不同类型的XHTML文档必须使用不同的DTD
2.xmlns xml namespace xml使用的命名空间
3.字符集 charset
GB2312 一个汉字由2个字节组成 大概能识别7000多个汉字 (10万个)(4000) 比如腾讯
gbk
iso uft-8 字符集 一个汉字由3个字节组成 非常大 例如小米
7.几个常用标签
1.段落标签
<p> 我是一个段落 </p>
注意:
标签的关系:
<p></p><b></b> 并列关系
<p><b></b></p> 包含关系
<p><b></p></b> 错误的
2.换行标签 <br/> 单标签
3.水平线标签 <hr/> 单标签
4.加粗标签 <strong></strong>
加粗标签还有一个 <b> </b>
区别: b 就是加粗的意思。 strong 加粗还有强调加强语气的用处。
所以,在网站中,站在优化的角度,如果比较重要的部分,能用strong就不用要b。
5.倾斜 <em></em>
倾斜还有一个 <i> </i>
区别: i 就是倾斜的意思。 em 倾斜还有强调加强语气的用处。
所以,在网站中,站在优化的角度,如果比较重要的部分,能用em就不用要i。
6.下划线 <u></u> 但是很少用 很少很少用
7.删除线 <s></s> 淘宝:<del> </del>
8.标签的使用
1.标签的分类
1. 双标签 <p></p>
2. 单标签 <br/>
2.标签作用
1.本身语义 例如: <marquee> 滚动文本 </marquee>
2.加强语气 例如: <strong> 强调加粗 </strong>
用标签做什么:
1. 选定内部内容
2. 设置相关属性
3.标签的属性
网页元素 : 文字 图片 视频 音频 flash 链接 js
<元素 属性1=“值1” 属性2=“值2”..... > </元素>
有些标签有属性 有些标签无属性
9.文字元素:控制文字
<font> 文字内容 </font>
size 文字大小
color 文字颜色 其中最常用的是 十六进制 #ff0000 也可以用 red
face 文字字体
例如:
<font size="4" color="#FF0000" face="微软雅黑">利用浏览器查看网页</font>
属性写在哪里?
<font color=red >
<手机 型号=‘红米’ 颜色=‘黑色’ 大小=‘4.7’></手机>
属性=值 这种写法我们称之为 键值对
10.图片元素 <img> 单标签
<img src=xxx.jpg>
src 来源路径
例如:
<img src=hai.jpg/>
width 宽度
height 高度
border 边框
title 提示文本 (鼠标经过才会有效果)
alt 替换文本(图片不显示是,显示的文本内容)
1.如果想要等比例缩放,只需要更改宽度或者高度其中的一个属性即可。
2.宽度和高度键值对,值的单位可以是绝对单位(像素)也可以是百分比
像素用px表示 百分比用 % 表示
例如我要给图片缩放一半大小:
width=50%
3.站在优化的角度来说,如果这个图片很重要,特别logo 给图片指定alt属性。如果有条件,可以再加title属性,进一步说明。
网页中用得到的图片格式:
1.gif 图片 最多256种颜色 可以做动画 可以透明
2. jpg jpeg 可以达到1650万种颜色 不可以透明 像素大,图片清晰 缺点图片大。
3.png 透明背景 颜色丰富 (现在运用较多)
4.bmp window系统自带图片格式,很少用 太大了
5.svg 现在网络最火的一种图片格式。(矢量图)
11.html文件命名规则:
有英文字母 数字 下划线组成 不要出现中文或者特殊符号。
例如: index.html demo12.html
12.水平线的属性设置
<hr/>
文字默认是黑色 宋体
width 宽度
size 改变粗细
color 颜色
对齐:
align 水平对齐
left 左 right 右 center 居中
例如:
align=“left” 水平左对齐
13.标题标签 <h>
<h1></h1> 一级标题
<h2></h2> 二级标题
<h3></h3> 三级标题
<h4></h4> 四级标题
<h5></h5> 五级标题
<h6></h6> 六级标题
字体加粗 自己单独一行
14.路径
1.相对路径
站在自身页面的角度来看 文件的位置。
下一级 用这个符号来表示 /
例如:<img src="product/pig.jpg" /> 下一级
上一级 用 ../
例如:<img src="../hai.jpg" /> 上一级
2.绝对路径
本地绝对路径: 用资源管理器的地址去寻找。
F:\案例\images\product\pig.jpg
注意:绝对路径的下一级 \
有一个致命的缺点: 可移植性太差。
网络绝对路径: 右击--图片地址
15.背景属性
background 背景图片
bgcolor 背景颜色
写在body标签中
<body bgcolor="#333366" background="bg.gif">
16.dw快捷键:
|
快捷键名称 |
功能 |
|
ctrl+b |
加粗(<strong>) |
|
ctrl+h |
唤醒提示 |
|
shift+enter |
生成换行标签(<br/>) |
|
F4 |
隐藏面板 |
|
ctrl+shift+空格 |
空格符号 |
|
输入法全角状态 |
一个空格=一个汉字 |
|
ctrl+1 ....6 |
<h1>..... |
|
|
转载请注明出处
html.day01的更多相关文章
- Jquery day01
day01: 基础--选择器.属性和CSS.文档处理 day02: 高级--筛选.事件.效果.ajax jQuery介绍 JS类库 JavaScript 库封装了很多预定义的对象和实用函数.能帮助使用 ...
- python Day01
Python Day01 Python 简介 介绍 Python 是一种面向对象.直译式的计算机程序设计语言,也是一种功能强大的通用型语言,已经有将近二十年的发展历史,成熟稳定.包含了一组完善而且容易 ...
- Spring day01笔记
struts:web层,比较简单(ValueStack值栈,拦截器) hibernate:dao层,知识点杂 spring:service层,重要,讲多少用多少 --> [了解] sprin ...
- 传智播客JavaWeb day01 快捷键、XML
2015-01-14 一直计划着学习java,今天晚上终于下定决心看了下传智播客朴乾老师的javaweb开发视频day01之第一讲,主要内容是开发工具简单介绍.怎么创建工程.Junit的介绍,我是C# ...
- python开发学习-day01 (python安装与版本、字符串、字典、运算符、文件)
*:first-child { margin-top: 0 !important; } body>*:last-child { margin-bottom: 0 !important; } /* ...
- coco2d学习day01 精灵分析
day01笔记 using namespace cocos2d; == USING_NS_CC; 一般用后面的 #ifndef __MYLAYER_H__ #define __MYLAYER_H__ ...
- day01课程回顾,数据类型
Day01 Python的分类 Cpython:代码àc字节码->机器码 一行一行的编译执行 Pypy: 代码àc字节码->机器码 全部转换完再执行 其他python 代码- ...
- Python学习之路——Day01
Day01 一.编程和编程语言 编程语言是人与计算机之间交流沟通的介质 编程就是人实现通过让计算机实现动作的文件 二.计算机的组成 1.控制器:负责控制指挥计算机硬件运行 2.运算器:负责数学与逻辑运 ...
- API.day01
第1部分 JDK API 1.1 API(Application Programming Interface,应用接口程序):已经封装好可以直接调用的功能(Java中以类的形式封装) 经常使用的JDK ...
- 《Professional JavaScript for Web Developers》day01
<professional JavaScript for Web Developers>day01 1.JavaScript简介 1.1JavaScript简史:略 1.2JavaScri ...
随机推荐
- C#执行oracle返回游标类型的存储过程
存储过程代码为: create or replace procedure proc_test(pCursor OUT pak_pub.ut_cursor) AS begin -- 使用游标 open ...
- Scut AccountServer
开始以Scut搭建服务器框架: 1. 初始目录结构: libs 存放 scut 的引擎文件: release 存放 src 输出的文件: src 存放各子工程源文件: 2. Install.bat:目 ...
- 使用iOS8 WKWebView的浏览器模块,脉冲动画层-b
KINWebBrowser是一个可嵌入app的浏览器模块. 它使用iOS 8的 WKWebView API编写,同时在iOS 7上使用UIWebView来兼容. 测试环境: Xcode 6.0 iOS ...
- 【VB】操作ODBC-DAO方式操作只能查询,不能更新插入操作解决。
最近接手一个改善项目,需要从Access转化到SQL Server 2014,使用原有的ODBC连接方式只能查询,不能更新插入.网上一直找不到解决方案,然后自己测试一下使用ADO方式竟然可以连接了.具 ...
- Whitespace character
In computer science, whitespace is any character or series of whitespace characters that represent h ...
- 【HDOJ】2757 Ocean Currents
简单BFS. /* 2757 */ #include <iostream> #include <queue> #include <cstdio> #include ...
- 老毛桃U盘启动盘制作工具V20140501完美贡献版
老毛桃U盘启动盘制作工具V20140501完美贡献版 下载地址:http://down.laomaotao.net:90/LaoMaoTao_V2014zhuangji.exe 老毛桃U盘装系统综合教 ...
- poj 2503 Babelfish(字典树哈希)
Time Limit: 3000MS Memory Limit: 65536K Total Submissions: 29059 Accepted: 12565 Description You hav ...
- (转载)在Linux下删除文件行末尾的^M符号方法
(转载)http://www.xinfengit.com/200907/1433646.html 由于DOS下的编辑器和linux(linux教程 linux培训 )编辑器对文件行末的回车符处理不一致 ...
- 浅谈JavaScript函数
JavaScript作为一种基于对象(非严格面向对象)的语言,函数在JS中的地位非同一般:用函数声明类和对象.甚至函数本身也是对象. 一.函数的三种声明方式辨析. 1.function命令 funct ...