html学习_认识html

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：

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可以写多个)

常用如下：

转载于:https://www.cnblogs.com/yangyutian/p/10409620.html

html学习_认识html相关推荐

python ui bs_Guibs的Python学习_列表
Guibs 的 Python学习_列表# 列表# 列表由一系列按特定顺序排列的元素组成, 其中元素和元素之间可以没有任何关系 # 在 Python 中, 用方括号 [] 来表示列表, 并用逗号 , 分 ...
python学习_循环语句
python学习_循环语句第1关:斐波那契数列斐波那契数列(Fibonacci sequence),又称黄金分割数列. 因数学家莱昂纳多·斐波那契(Leonardoda Fibonacci)以兔子 ...
linux系统编程学习_(2)进程控制-- fork函数、exec函数族、回收子进程--孤儿进程僵尸进程、wait函数
linux系统编程学习_(2)进程控制-- fork函数.exec函数族.回收子进程–孤儿进程僵尸进程.wait函数进程控制 fork()函数创建一个子进程. pid_t fork(void); ...
交通流分析2：《基于公共交通大数据的上海市居民出行时空特征研究_王宇》和《面向交通拥堵预测大数据的神经网络群组快速学习_沈晴》阅读总结
上一篇的地址:https://blog.csdn.net/qq_43012160/article/details/103313749 基于公共交通大数据的上海市居民出行时空特征研究_王宇这篇论文内容 ...
linux lvm 8e下继续划分分区,linux下LVM学习_逻辑卷管理
一.LVM介绍 LVM是 Logical Volume Manager(逻辑卷管理)的简写,它是Linux环境下对磁盘分区进行管理的一种机制,通过LVM可以在不停机的情况下调整分区大小,提高了磁盘分区 ...
机器学习深度学习加强学习_加强强化学习背后的科学
机器学习深度学习加强学习机器学习 ,强化学习 (Machine Learning, Reinforcement Learning) You're getting bore stuck in lock ...
STL学习_配接器篇
STL学习_配接器篇定义配接器(Adapter)在STL组件的灵活组合运用功能上,扮演着轴承.转换器的角色.它事实上是一种设计模式.即将一个class的接口转换为另一个class的接口,使原本因接 ...
TIA博途SCL学习_堆栈的入栈和出栈（后入先出）程序示例
TIA博途SCL学习_堆栈的入栈和出栈(后入先出)程序示例如下图所示,添加一个FB块,语言选择SCL,命名为"入栈", 如下图所示,通过FOR循环实现堆栈数组内的元素的移动,并将 ...
python 学习_第五模块 DMO
python 学习_第五模块 DMO 1. 节点 <!DOCTYPE html> <html lang="en"> <head><meta ...
python多线程编程模块不包括_python 学习_第四模块并发编程（多线程）
python 学习_第四模块并发编程(多线程) 一开启线程方式 from threading importThreadimporttimedefsay(name): time.sleep(2)p ...

html学习_认识html

html学习_认识html相关推荐

最新文章

热门文章