html简介

1 html是什么:超文本标记语言

  • 超文本:文字/图片/音频/视频
  • 标签/标记:<body></body>
  • 怎么做:使用标签来创建网页

2 HTML的用途:是用来编写静态网页的。

  • 搭建整个网页。(框架)CSS用来装修。。。

3 html结构

1 <html>
2 <head>
3 包括资讯信息:整个页面的属性、指导浏览器解析的标签、引入外部文件的标签
4 </head>
5 <body>
6 我们需要展示的信息
7 </body>
8 </html>

4 区分正斜杠和反斜杠

  • / 正斜杠
  • \ 反斜杠(下坡)

5 开始标签和结束标签

1 <html>(开始标签)
2 关键字
3 </html>(结束标签)

6 书写规范

  • PS:标签之间嵌套出现
  • 标签之间的层次关系要规范
  • 大部分标签都具有属性 属性="属性"
  • html不区分大小写:建议小写
  • 命名的时候尽量使用英文来编写
  • 注释:要有写注释的意识 <!-- -->

html的标签

html:根标签

head:

<head>
//设置整个网页的编码格式
<meta charset = "UTF-8">
//设置网页标题
<title> 菜鸟-传奇</title>
</head

body:

 <body >
text:文本的颜色
bgcolor:背景色
background:背景图片 <body text="#00ff00" bgcolor="#00" backgroud="">

//在html代码中,无论有多少个空格,浏览器解析后都认为只有一个空格

空格:&nbsp

//换行

<br>//可以单独存在

//段落标签 单独成一行

<p>
//xxxx
</p>

//水平线

<hr width:“长度 ”//100px--50%-->
width:长度 //100px--50%--
size:粗度
color:颜色
align:对齐方式 

1 文字标签

<font>文字标签
color:颜色
size:粗度
face:字体的类型 <h1>到<h6>标签 //标题字体的大小 //字体的加粗
<b >
<strong>

2 清单/列表的标签

无序列表:
<ul //type改变前面的圆点样式>
<li>
xxxxxxx
</li>
<li>
xxxxxxx
</li>
</ul> 有序列表:
<ol //type改变前面的排序样式
// 1 A I 。。。
//start="2"从那个数字开始>
<li>
xxxxxxx
</li>
<li>
xxxxxxx
</li>
</ol>

3 图形标签

//src:图形的地址
<img src="img/tp.jpg"/ >
width:宽度
height:高度
border:边框
align:对齐方式(top。。。。)
alt:图片描述//加载文件丢失才出现

4 链接标签

<a> //属性
href="跳转"

5 表格标签

table

6 块级标签

<div> <p><table>
块级标签:不允许其他元素并排 行级标签:span:允许其他元素并排 设置样式是可以的,但是设置的高度和宽度是无效的

</body >

前端学习:HTML的学习总结的更多相关文章

  1. 转 - Web新人(偏前端)应该怎样学习(个人观点,勿喷)

    我自己是会计专业,转行自学web的,学习有一两年了,也还是新人一个,只不过不是那种超级“新”的,所以有什么话说得不对,请轻喷.欢迎大家来和我交流. 1.我能不能转行学web? 能不能学web这个不是别 ...

  2. Web前端与移动开发学习路线图

    文章转载自「开发者圆桌」一个关于开发者入门.进阶.踩坑的微信公众号 这里整理的Web前端与移动开发学习路线图包含初中级两个部分,你可以通过百度云盘下载观看对应的视频 链接: http://pan.ba ...

  3. 2019最新WEB前端开发小白必看的学习路线(附学习视频教程)

    2019最新WEB前端开发小白必看的学习路线(附学习视频教程).web前端自学之路:史上最全web学习路线,HTML5是万维网的核心语言,标准通用标记语言下的一个应用超文本标记语言(HTML)的第五次 ...

  4. 《疯狂前端开发讲义jQuery+Angular+Bootstrap前端开发实践》学习笔记

    <疯狂前端开发讲义jQuery+Angular+Bootstrap前端开发实践>学习笔记 二〇一九年二月十三日星期三2时28分54秒 前提:本书适合有初步HTML.CSS.JavaScri ...

  5. 前端html与css学习笔记总结篇(超详细)

    第一部分 HTML 第一章 职业规划和前景 职业方向规划定位: web前端开发工程师 web网站架构师 自己创业 转岗管理或其他 web前端开发的前景展望: 未来IT行业企业需求最多的人才 结合最新的 ...

  6. 想做web前端project师应该学习些什么?

    偶然间看到这篇文章.感觉博主写的挺不错的,假设你想做web前端project师的话,建议您阅读下面这篇文章,事实上web前端project师所做的工作事实上就是站点设计,有些小公司的美工事实上就是做w ...

  7. PHP Loser 说说做前端需要如何进一步学习

    PHP Loser 说说做前端需要如何进一步学习 做前端的,需要如何进一步学习?书籍这个事情贵精不在多,我这里推荐两本即可: <javascript教程 高级程序设计> <CSS权威 ...

  8. 前端学习:JS学习总结(图解)

    前端学习:JS学习总结(图解) JS的代码笔记 JS比HTML和CSS的知识点要多的多,下面分几段来介绍其内容... 为了能让大家更好的检索,前面的图解是整个JS的概括,后面的才是知识点... 旁边就 ...

  9. 最全的WEB前端开发程序员学习清单

    史上最全的WEB前端开发程序员学习清单! 今天为什么要给大家分享这篇文章呢,我发现最近来学前端的特别多,群里面整天都有人问:前端好找工作吗?前端要怎么学啊?前端工资怎么样?前端XX,前端XXX,虽然我 ...

  10. #学习笔记#e2e学习使用(二)

    前言: <#学习笔记#e2e学习使用(一)>主要记录了Vue项目的创建到e2e环境的搭建,以及期间遇到的各种问题和解决方法.本文建立在基础测试环境搭建完毕能正确运行的情况下,编写测试代码, ...

随机推荐

  1. canvas的常用功能(电脑版)

    前言: canvas可以单独算为前端的一大知识模块, 今天就研究一下. 先做下前文铺垫: ①创建canvas <canvas id="myCanvas" width=&quo ...

  2. ios开发的技巧

    http://www.cocoachina.com/ios/20141231/10783.html

  3. bat脚本里面if else if的写法

    曾经困扰了很久的bat脚本,如果里面包含多种条件判断,就必须要试用if,else if,else的写法了.尝试了很久,终于找到规律: 第一种写法:最简单,就是写一行. @echo off rem 写一 ...

  4. python关于SSL的认证--pycurl模块使用

    今天在做微信支付退款接口的时候,因为需要使用到双向证书的认证,所以一开始是没有头绪的,后来在网上找到了相类似的教程,发现了pycurl模块,才成功实现了证书认证,教程链接:http://blog.cs ...

  5. 201871010104-陈园园 《面向对象程序设计(java)》第十一周学习总结

    201871010104-陈园园 <面向对象程序设计(java)>第十一周学习总结 项目 内容 这个作业属于哪个课程 https://www.cnblogs.com/nwnu-daizh/ ...

  6. python27期day06:小数据池、深浅拷贝、集合、作业题。

    0.pycharm是代码块.黑窗口是小数据池.如下图: 1.驻留机制(长得像的共用一个内存地址)分小数据池缓存机制:后期开发时能明确知道.为什么不能正常使用.把经常用的东西放入规则(黑窗口)里. 数字 ...

  7. USACO River Crossing

    洛谷 P2904 [USACO08MAR]跨河River Crossing https://www.luogu.org/problem/P2904 JDOJ 2574: USACO 2008 Mar ...

  8. AndroidStdio模拟器打不开报错 Guest isn't online after 7 seconds

    开了好几次模拟器,始终运行不出来原来的一个项目.报错如下: 解决方案: 经过百度,可能是Android Studio 3.0升级到3.0.1,启动原来建好的模拟器废掉了. 找到你软件中的 建议选择屏幕 ...

  9. TP5导入EXCEL到数据库

    前期准备工作: 1.下载PHPExcel放到vendor下 2.前端页面: <form action="save" method="post" encty ...

  10. testcontainers 方便的db测试框架

    testcontainers是一个强大,简单,基于容器的db测试解决方案 目前已经支持了主流的开发语言 参考资料 https://github.com/testcontainers/testconta ...