1、HTML骨架

<html>----根标签

<head>---头标签

</head>

<body>---主体标签

</body>

</html>

2、html主要是表现网页中的元素(内容)

a、html标签:

双标签  <标签名></标签名>

单标签  <标签名 />

b、标签的相互关系:

嵌套关系(父子、孙子)---子元素最好缩进一个tab

并列关系(兄弟)--对齐就行

3、开发工具

sublime、webstorm、vscode

4、<!DOCTYPE html>---文档类型

告诉我们和浏览器我们使用的是哪个html版本,html有很多版本

比较早的有html:xt

我们目前都用的html: 5更简洁些,

5、<meta charset=“UTF-8”>  字符集 告诉浏览器使用的字符集

UTF-8  最大的字符集  几乎包含了所有国家用到的字符,使用后避免出现字符集不统一而引起的乱码问题

6、标签的语义化

7、排版标签:

标题标签(h1-h6)、段落标签(p)、水平线(<hr />)、换行标签(<br />)

div 、span标签(2布局标签无语义是重点)

8、文本格式化标签:

9、图片:一般情况下我们只需设置图片的宽度或高度一项就可以,另外的那个会等比例缩放(不至于拉伸图片)

<img />图片的属性:src (来源的路径 必需写属性)、 alt 、title、 border、 width 、height

10、链接标签

外部链接 : 链接地址已http://开头

内部链接:  只需写上去往路径

<a> </a>属性:href(去往的路径 必需写属性)、target=“_blank”  target="_self"(默认)

11、锚点定位(适合于较长的页面,我们可以点击某个关键词从而迅速到达页面中的某个位置)

步骤:

eg:  

<a href="#main">主要内容</a>

<div id="main">锚点</div>

12、base标签

单标签:img br hr base

13、相对路径

相对路径:

a.同一级路径(./)     xx.jpg

b.下一级路径         xx/xx.jpg

c.上一级路径(../)    ../xx.jpg

绝对路径:

a.找到图片属性查看位置(C:\...)(一般不会用的)

b.复制图片地址

14、列表标签

a.无序列表:  ul>li

注意事项 :ul里只能放置li标签;li标签相当于一个容器,里面可以放置所有的元素;无序列表有一些默认的样式用css搞定。

b.有序列表:ol>li

注意事项 :ol里只能放置li标签;li标签相当于一个容器,里面可以放置所有的元素;有序列表有一些默认的样式用css搞定。

c.自定义列表:dl>dt+dd  (dd是围绕dt来解释的,dd可以写多个)

常用如下:

html学习_认识html的更多相关文章

  1. python学习_数据处理编程实例(二)

    在上一节python学习_数据处理编程实例(二)的基础上数据发生了变化,文件中除了学生的成绩外,新增了学生姓名和出生年月的信息,因此将要成变成:分别根据姓名输出每个学生的无重复的前三个最好成绩和出生年 ...

  2. Linux操作系统学习_操作系统是如何工作的

    实验五:Linux操作系统是如何工作的? 学号:SA1****369 操作系统工作的基础:存储程序计算机.堆栈(函数调用堆栈)机制和中断机制 首先要整明白的一个问题是什么是存储程序计算机?其实存储程序 ...

  3. 『TensorFlow』SSD源码学习_其一:论文及开源项目文档介绍

    一.论文介绍 读论文系列:Object Detection ECCV2016 SSD 一句话概括:SSD就是关于类别的多尺度RPN网络 基本思路: 基础网络后接多层feature map 多层feat ...

  4. jQuery源代码学习_工具函数_type

    jquery源代码学习_工具函数_type jquery里面有一个很重要的工具函数,$.type函数用来判断类型,今天写这篇文章,是来回顾type函数的设计思想,深入理解. 首先来看一下最终结果: 上 ...

  5. TypeScript学习_入门向

    TypeScript学习_入门向 1-TypeScript简介 首先官网祭天 ---> https://www.tslang.cn/ TypeScript 是 JavaScript 的一个超集, ...

  6. 《mysql必知必会》学习_第八章_20180730_欢

    第八章学习LIKE操作符,百分百(%)通配符,下划线(_)通配符 P47 select prod_id,prod_name from products where prod_name LIKE 'je ...

  7. labview学习_入门篇(一)

    写在前面的话: 在上大学的时候,实验室的老师推荐用labview工具编写上位机软件,当时不想用labview,感觉不写代码心里不踏实,后来用vb和matalb开发了上位机软件.但现在由于部门的几款工具 ...

  8. Deep Learning 17:DBN的学习_读论文“A fast learning algorithm for deep belief nets”的总结

    1.论文“A fast learning algorithm for deep belief nets”的“explaining away”现象的解释: 见:Explaining Away的简单理解 ...

  9. python学习_应用pickle模块封装和拆封数据对象

    学习文件数据处理的时候了解到有pickle模块,查找官方文档学习了一些需要用到的pickle内容. 封装是一个将Python数据对象转化为字节流的过程,拆封是封装的逆操作,将字节文件或字节对象中的字节 ...

  10. python学习_数据处理编程实例(一)

    目的:用一个实例总结学习到的with语句,函数,列表推导,集合,排序,字符分割等内容 要求:分别以james,julie,mikey,sarah四个学生的名字建立文本文件,分别存储各自的成绩,时间格式 ...

随机推荐

  1. Oracle voting文件的管理

    在12c中,不再支持使用dd命令进行voting disk文件的备份和恢复 投票文件的管理需要OCR文件正常工作.在删除.添加.替换或者还原voting文件之前,使用ocrcheck检查ocr文件的状 ...

  2. html中&lt;a&gt;标签的种类

    在html中a 标签是一个链接标签,然而a 标签也有非常多的种类,在此做一个小结. 一.普通链接 <a href="http://www.baidu.com">百度&l ...

  3. Communications link failure due to underlying exception异常处理(转)

    最近的一个项目在Hibernate使用C3P0的连接池,数据库为Mysql.开发测试没有问题,在运行中每个一段长的空闲时间就出现异常: java 代码 org.hibernate.exception. ...

  4. iOS的动态代理模式的实现

    动态代理模式的应用很多,特别是在不能修改被代理类的前提下,要对执行某些方法时需要打log或者捕捉异常等处理时,是一个非常方便的方法.只需要少量修改客户端(场景类)代码和添加一个代理类就可以实现,这个符 ...

  5. 无意识(无知)-->有意识-->进入潜意识-->无意识(本能状态)

    无意识(无知)-->有意识-->进入潜意识-->无意识(本能状态) 1. 从“无意识-->有意识”的两个重要内容是“反省”+“要努力学习”,估计有80%的人无法跨过这一步 2. ...

  6. 【emWin】例程二十七:窗口对象——Listview

    简介: LISTVIEW小工具可在具有多个列的列表中选择某个元素.由于LISTVIEW小工具包含了 一个HEADER小工具,因此可对列加以管理(排序等).所创建的LISTVIEW 既可以无环绕型框架窗 ...

  7. 教你一招:修复win7 系统自带的截图工具损坏

    这个问题经常见,原因是注册表没有导入. 修复很简单. 打开资源管理器,在C盘中搜索到 tpcps.dll ,在其中选一个右击,选择注册dll,然后截图工具就被修复了. 有时候便签也会出现类似问题,方法 ...

  8. Web - JSONP和同源策略漫谈

    0x00 前言 关于JSONP网上有很多文章了,我也是在拜读了别人的文章的基础上来写写自己的看法,这样可以加深自己印象,巩固一下学习效果.我们需要做的就是站在巨人的肩膀上眺望远方. 0x01 起 在W ...

  9. Java知多少(78)Java向量(Vector)及其应用

    Vector(向量)是 java.util 包中的一个类,该类实现了类似动态数组的功能. 向量和数组相似,都可以保存一组数据(数据列表).但是数组的大小是固定的,一旦指定,就不能改变,而向量却提供了一 ...

  10. Java反射,参数为数组

    使用反射调用非公开的方法有时能解决许多问题,如果方法的参数是数组时类型该怎么传递呢?这里找到了一种方法记录一下 实例 比如: class A{ private void sayHello(String ...