首页 > 程序开发 > web前端 > HTML/CSS >

HTML初认识

2016-07-18

HTML(Hyper Text Mark-up Language)即超文本标记语言或超文本链接标示语言,是目前网络上应用为广泛的语言,也是构成网页文档的主要语言。HTML文本是由HTML命令组成的描述性文本,HTML命令可以说明文字、图形、动画、声音、表格、链接等

1、主流浏览器

简写 EN CN
FF Mozilla Firefox 火狐浏览器
IE Internet Explorer IE浏览器
Chrome Google Chrome 谷歌浏览器
Opera Opera 欧鹏浏览器
Safari Safari 苹果浏览器

浏览器


2、网页编辑工具

编辑工具


3、什么是网页<喎"http://www.2cto.com/kf/ware/vc/" target="_blank" class="keylink">vc3Ryb25nPjwvcD4NCjwvYmxvY2txdW90ZT4NCs340rPKx8341b7W0LXEPHN0cm9uZz7IzrrO0rvSs8PmPC9zdHJvbmc+o6zNqLOjzsS8/sCp1bnD+86qaHRtbKGiu/JodG0gzfjVvtPD09rVucq+z+C52MTayN21xM340rO1xLyvus8NCjxociAvPg0KPGJsb2NrcXVvdGU+DQoJPHA+PHN0cm9uZz40oaJIVE1MvPK96Twvc3Ryb25nPjwvcD4NCjwvYmxvY2txdW90ZT4NCjxwPkhUTUyjqDxzdHJvbmc+SHlwZXIgVGV4dCBNYXJrLXVwIExhbmd1YWdlPC9zdHJvbmc+o6m8tDxzdHJvbmc+s6zOxLG+seq8x9Pv0dQ8L3N0cm9uZz678rOszsSxvjxzdHJvbmc+wbS90zwvc3Ryb25nPrHqyr7T79HUo6zKx8S/x7DN+MLnyc/TptPDzqq547e6tcTT79HUo6zSssrHubmzyc340rPOxLW1tcTW99Kq0+/R1KGjSFRNTM7Esb7Kx9PJSFRNTMP8we7X6bPJtcTD6Mr20NTOxLG+o6xIVE1Mw/zB7r/J0tTLtcP3zsTX1qGizbzQzqGitq+7raGiyfnS9KGise248aGiwbS907XIPC9wPg0KPHA+PHN0cm9uZz5IVE1st6LVucq3PC9zdHJvbmc+PC9wPg0KPHRhYmxlPg0KPHRoZWFkPg0KCTx0cj4NCgk8dGg+DQoJCbDmsb48L3RoPg0KCTx0aD4NCgkJxOq33TwvdGg+DQoJPC90cj4NCjwvdGhlYWQ+DQo8dGJvZHk+DQoJPHRyPg0KCTx0ZD5IdG1sPC90ZD4NCgk8dGQ+MTk5MTwvdGQ+DQoJPC90cj4NCgk8dHI+DQoJPHRkPkh0bWwrPC90ZD4NCgk8dGQ+MTk5MzwvdGQ+DQoJPC90cj4NCgk8dHI+DQoJPHRkPkh0bWwyLjA8L3RkPg0KCTx0ZD4xOTk1PC90ZD4NCgk8L3RyPg0KCTx0cj4NCgk8dGQ+SHRtbDMuMjwvdGQ+DQoJPHRkPjE5OTc8L3RkPg0KCTwvdHI+DQoJPHRyPg0KCTx0ZD5IdG1sNC4wLjE8L3RkPg0KCTx0ZD4xOTk5PC90ZD4NCgk8L3RyPg0KCTx0cj4NCgk8dGQ+WEh0bWwxLjA8L3RkPg0KCTx0ZD4yMDAwPC90ZD4NCgk8L3RyPg0KCTx0cj4NCgk8dGQ+SHRtbDU8L3RkPg0KCTx0ZD4yMDEyPC90ZD4NCgk8L3RyPg0KCTx0cj4NCgk8dGQ+WGh0bWw1PC90ZD4NCgk8dGQ+MjAxMzwvdGQ+DQoJPC90cj4NCjwvdGJvZHk+DQo8L3RhYmxlPg0KPGhyIC8+DQo8YmxvY2txdW90ZT4NCgk8cD48c3Ryb25nPjWhokhUTUzM2LXjPC9zdHJvbmc+PC9wPg0KPC9ibG9ja3F1b3RlPg0KvPLS19DUIL/JwKnVudDUoaEgxr3MqM7eudgNCjxociAvPg0KPGJsb2NrcXVvdGU+DQoJPHA+PHN0cm9uZz42oaJIVE1Mu/mxvtfps8m1pc67PC9zdHJvbmc+PC9wPg0KPC9ibG9ja3F1b3RlPg0KPHA+serHqaO6seq8xyZyZHF1bzvKx9K70Km3+7rFo6zTw8C0x/i31s7EtbXW0LXEsrvNrLK/t9Y8YnIgLz4NCrHqx6m1xLfWwOA8YnIgLz4NCrWlserHqTxiciAvPg0Ky6ux6sepPGJyIC8+DQqx6septcS7+bG+0LS3qDxiciAvPg0KtaWx6sepPGJyIC8+DQqx6septcTX6bPJPGJyIC8+DQqx6sepILHqx6nK9NDUPC9wPg0KPGhyIC8+DQo8YmxvY2txdW90ZT4NCgk8cD48c3Ryb25nPjehokhUTWy7+bG+uea3tjwvc3Ryb25nPjwvcD4NCjwvYmxvY2txdW90ZT4NCjxwPjxzdHJvbmc+SHRtbDQuMLXEu/mxvrnmt7Y8L3N0cm9uZz48L3A+DQqx6sepw/u6zcr00NTD+7PGsrvH+LfWtPPQodC0IEhUTUyx6sepsrux2Mirsr+52LHVIMr00NTWtdPD0v26xbvy1d+yu9PD0v26xcCoxvDAtCCx6sepsdjQ69X9yLfHtszXIM7EtbWx2NDr07XT0NK7uPa4+dSqy9ijrMv509C1xFhIVE1M1KrL2LHY0OvHtszX09q4+dSqy9jW0A0KPHA+PHN0cm9uZz5YSFRNTLv5sb655re2PC9zdHJvbmc+PC9wPg0KserHqcP7us3K9NDUw/uzxrHY0OvQodC0IEhUTUyx6sepsdjQ67nYsdUgyvTQ1Na1sdjQ69PD0v26xcCoxvDAtCCx6sepsdjQ69X9yLfHtszXIM7EtbWx2NDr07XT0NK7uPa4+dSqy9ijrMv509C1xFhIVE1M1KrL2LHY0OvHtszX09q4+dSqy9jW0A0KPHA+PHN0cm9uZz5IdG1sNbXEu/mxvrnmt7Y8L3N0cm9uZz48L3A+DQq21NPaaHRtbDS6zXhodG1stcS55re2try/ydLUsqK21NTau/m0ocnP09bX9sHLvPK7r6O6PHN0cm9uZz69pb341PbHv7rN08XRxb21vLY8L3N0cm9uZz4NCjxociAvPg0KPGJsb2NrcXVvdGU+DQoJPHA+PHN0cm9uZz44oaJIVE1MNbrNSFRNTDS1xMf4sfA8L3N0cm9uZz48L3A+DQo8L2Jsb2NrcXVvdGU+DQrJ+cP3PGJyIC8+DQpIVE1M0rLT0LrctuC49rK7zay1xLDmsb6jrNa709DN6sirw/ew19Kzw+bW0LXEyrnTw7XEyLfH0EhUTUyw5rG+o6w8YnIgLz4NCuSvwMDG97LFxNzN6sir1f3It7XYz9TKvrP2SFRNTNKzw+aho9Xivs3Kx9PDtKYNCjxwcmUgY2xhc3M9"brush:java;"> HTML5: HTML4.01 XHTML 1.0 文档类型声明
5:
4:

编码设置

 
             type 省略
type 省略 <script></script>type省略

9、开始学习HTML

站点:一个站点存储了一个网站包含的所有文件

站点的建立
html的基本结构
常用的标签

常用标签

h1-h6   

标题文字

标题一

只能出现一次 属性: align 水平对齐:center|right 有六级标题 P

段落文字

默认段落与段落之间有一行空白
默认居中对齐 Br
换行 Img 单标签 设置宽度 等比例 缩小 | 而只设置高度不是 “”/ Span 文字 Div
任何内容
I 倾斜的文字 Em 倾斜的文字 a 相对路径 和绝对路径格式为: 超链接名称 Strong 加粗的文字 B 加粗的文字 特殊符号: 空格 空格在浏览器展示 的效果不一样的 火狐半个 三种列表标签 无序列表:circle属性值 disc=实心圆 circle=空心圆 square=正方形
  • 列表内容
有序列表:type属性值a (a b c)| A(A B C)|i|I start = "3"后 面只能跟数字 reversed 倒叙
  1. 列表内容
定义列表:(应用:左图 右字)
定义项
描述项
>大于号 <小于号 超级链接标签 target属性:_blank 我可以是文字,页可以是图片 可以链接内容: html文件"音视频|压缩软件(下载)|图片|Wps 内部链接<链接自己网站>|外部链接<链接别人网站> href="#"标示空链接 点击跳转首部 外部链接

路径

相对路径:相对路径就是指由这个文件所在的路径引起的跟其它文件(或文件夹)的路径关系。
相对路径:

两个文件都放在同一文件夹。直接写名字图片 两个文件分别在不同的文件夹里面。../文件夹名称/文件名称img 一个文件夹外,一个文件夹内。文件夹名称/文件名称

绝对路径:是指文件在计算机或网络上的绝对地址位置,从盘符或协议名称开始。例如:
file:///E|/works/公开课/1/style/miancss.css
http://cdn.bootcss.com/jquery/1.11.3/jquery.min.js


HTML5新增了标签



HTML5废除的标签

1、能用css代替的元素basefont、big、center、font、s、strike、tt、u
2、不再使用frame框架
3、只有部分浏览器支持的元素applet、bgsound、blink、marquee等标签
4、其他被废除的元素
Rb acronym dir isindex listing xmp nextid plaintex

————-部门划分—————
1:业务部门-需要做网站
2:设计部门-制作图片格式.jpg/.psd
3:制作部门-切成网页 前端开发工程师
4:后台部门-后台程序添加数据设计部门

网站制作流程:

最近流行->扁平化 | 2010年->立体化

响应式网站:做一个网站既可以在PC也可以移动端;

谷歌浏览器可以测试移动

网页中可以插入图片格式: 图片

jpg/jpeg:可以存储丰富多彩的颜色,不支持动画和透明(人物/风景)保真  ===有损压缩
gif:只存储256种颜色(少)赞 |小图片  支持动画|透明===有损压缩
png:可以丰富多彩的图片|不支持动画|支持透明|占用空间大(运用多数移动移动端)===无损压缩

行和行之间会有一段距离


直接换行,换行无距离 自行演示效果观察看见

更多字符实体

html字符实体 更多可查看对应文档
    &copy;=版权 
    &reg;注册商标
    <小于号
    >大于号
    & 和号
    "引号
    &apos撇号

api

HTML_api 下载 访问密码 06ee
CSS_api 下载 访问密码 08da


自学网站
W3school

相关文章
热点推荐