很荣幸,笔者小剑将在今天开始写博客,以记录学习过程中的一些知识和问题,欢迎一起讨论!
(声明:本文图片 部分来自网络 以下不再一 一声明)
第一节 HTML 这玩意是谁发明的?
我们都知道HTML是一种超文本标记语言,这玩意其实在网站的后台对应着成对的元素标签,每个标签对应着不同的表示。按一下你键盘的F12,就可以清晰的看见 这些代码究竟是什么玩意。
问题1:这玩意谁发明的?
没错就是图片上的这位仁兄,其名曰:
Tim Berners-Lee
(本来因为他已经挂了,没想到还是这么年轻。。)
他做了什么?
WWW就是万维网World Wide Web 中文直译就是:像世界那么大的网
WWW=URL+HTTP+HTML
其实,他就是想让本地开发的HTML文本显示让全世界的人都能看到,他做了一件事 WWW,其实 就是让每个人输入地址就能看到网页,就是这么简单。
- 当世界上没有网址,这家伙发明了URL
- 当世界上没有网页,这家伙发明了HTML
- 为了让这一套系统更加完善 ,他发明了HTTP
第二节 HTML起手式与代码的快速编写
了解了这个创始人,下面我们快速进入编码阶段 先都来看看 这个网站的代码架构大概是什么样子的?
将从以下几个方面快速展开。
- 常用的表章节的标签有哪些,分别是什么意思(h1~h6、section、article、main、aside 等等)
- 全局属性有哪些
- 常用的内容标签有哪些,分别是什么意思(a、strong、em、code、pre 等等)
常用的表章节的标签有哪些,分别是什么意思?
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>小剑的前端笔记</title>
</head>
<body>
<main>
<header>放在头部的标签 比如 可以放 导航栏 欢迎语</header>
<h1>调节文章的标题大小 h1-h6 逐级递减</h1>
<section> 第x章</section>
<article>
文章部分
<p>段落标签</p>
</article>
<div> div就是一块区域的划分 你可以把他想象成地皮,上面的section article footer 和headr 其实都说是div本质上来说,但是写成那样方便阅读代码</article></div>
<aside>旁边内容 可能是网站左边或者右边的某一块区域 通过属性可以设置哦</aside>
<footer>尾部 一般写 XXX版权归XX所有</footer>
</main>
</body>
</html>
显示的效果就跟上面一样 div就是一块地皮 一块区域的划分。
全局属性有哪些?
所有的标签都可以加上这些个 所谓的属性 然后产生一些动态或者静态的效果
class 表示一个类 比如
那这一块区域的地皮都是XX这个人的 以后我们对XX进行配置一些样式就可以操作这个classid 唯一的标签类 实际上 存在多个也是可以的,上面的是大类 id就是专属的比如个人 某家公司
hidden 添加这个属性后 某块元素区域将会消失
style
在标签中就可以设置这个里面字体的颜色 比如红色 但是后面的css统一设置更方便tabindex 按住tab键就可以在浏览器中跳过这些个块 其中他的值为0的时候是最后一个跳过去 -1的时候代表的是flase永远也选不中 1的时候是第一个选择按tab
title 设置了这个之后 触碰某段文字或图片下面会有一个吐丝 解释内容用
常用的内容标签有哪些,分别是什么意思?
ol+li 有序列表 包在这里面的段落带 1 2 3
ul+li 无序列表 包在这里面的段落不带 1 2 3 可能是点
dl+dt+dd dl相当于是一个段落列表 里面的标题就是dt dd 就是内容
hr 这个标签是下划线
br 这个标签是换行
a 超链接用的 放一个网址 人家点击就可以进去
em 加强字体 斜体
strong 加粗
code 这里面的代码会被识别 并且等宽
q+blockquote 块元素 q是块内的内联显示 好比段落p在div
今天的学习就到这里下课,有疑问或对前端感兴趣的可以加我qq782877160 注明备注