html 分割线_大数据可视化【01】——网页前端基础知识(HTML+JAVASCRIPT+CSS)

【前言】

这篇已经在草稿里躺尸好久了,先不管了,发了再说。

ECharts数据可视化项目 中下篇会对教程视频进行文档转录。

另: 我现在都很讨厌这种纯图/动图/文字 的 学习模式。

下面两种才能将学习效率提升到最大化好嘛,我也想打造一种这样的学习网站,所以网页基础必须得先打好。

视频版:

可交互视频​eater.net
153222777aeba2e5ac2dbbb7932d41da.png

图文版:

左边文档 右边实战​www.shiyanlou.com
0a24dca0c97be38c400b1d0a3e3f486a.png

50fe00c7cbee23f0970d577cfcd97de6.png

【1.HTML】

建议不要一上来就学HTML,先学会用Typora做笔记,把Typora玩精,等快捷键都记得差不多了(参见下面文章),再去了解HTML标签,什么<b> </b>之类的,typora就一个快捷键的事儿。md标记语言跟html标记语言差不多的,可以进入Source Code Mode 观察,而且Typora也支持导出HTML,可在网页中F12 查看代码。

X Tesla:学生党/上班族必备软件(不看就后悔!)(Typora最全的快捷键)​zhuanlan.zhihu.com
94697be828ede67a0fb4f1d64f522430.png

ce64c234c22bdaacd980901147d3e629.png
  • a 链接标签,插入标签,href描述链接目标 <a href="https://www.zhihu.com">zhihuya</a>
  • img 图片标签,插入图片<img src="https://www.abcdefg.com/a.jpg" width="100" height="100">
  • <hr>单个hr标签水平分割线
  • <br>单个br标签换行
  • <!-- 注释--> 注释标签
  • CSS修饰
    • 内联样式,即放在h1 p这样的标签内部,<h2 style="background-color:red;">段落呀</h2>
    • 内部样式表,<head><style> ...</style></head>,head换成body也可以。
    • 外部样式表,<body><link rel="stylesheet" href="test.css"></body> ,link定义资源引用地址。
  • div是块级元素,通常以新行来开始,span是内联元素,通常不会以新行开始。

3ef0ab199aa9d2e4d9a6de74444cf308.png

【2.Javascript】

43fbb9341a4a69fcd6b674190bd19f11.png

bd4b768cbcd37a7cf3fdd2663cba7033.png

【3.CSS】

87abcfecb3c6de048a12c81d4c933bd0.png
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值