HTML学习笔记(一)——基础标签及常用编辑器技巧
HTML
初识html
什么是html?
- html是超文本标记语言(hyper text markup language)
html5的基本结构
<!DOCTYPE html>
<!--DOCTYPE 即文本类型,说明这是一个标准的HTML5文档-->
<!--<html></html>标签是文档的根标签-->
<!-- 标签有双标签和单标签 -->
<html>
<head>
<!-- head用于对网页的说明 ,不会显示在网页中-->
<meta charset=utf-8 /> <!--告诉浏览器改网页的编码为utf-8的格式-->
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
<title>document</title>
</head>
<body>
<!--body中为页面的内容,是网页显示的部分-->
</body>
</html>
html常用标签
标题标签(h1——h6)
<h1>标题1</h1>
<h2>标题2</h2>
<h3>标题3</h3>
<h4>标题4</h4>
<h5>标题5</h5>
<h6>标题6</h6>
段落标签(p)
<p>这是一段文章</p>
图片标签(img)
<img src="url" alt="鼠标悬浮显示的文字">
列表标签
无序列表(ul,li)
<ul>
<li>列表1</li>
<li>列表2</li>
<li>列表3</li>
</ul>
有序列表(ol)
<ol>
<li>列表1</li>
<li>列表2</li>
<li>列表3</li>
</ol>
有序与无序仅仅只是默认的css样式不通
链接标签(a)
<!--页面外跳转-->
<a href="http://www.baidu.com" target="_blank" rel="noopener noreferrer">百度一下</a>
<!-- target=“_blank”设置从空白页打开 -->
<!--页面内跳转-->
<a href="#content"></a>
容器标签(div)
<div></div>
表单标签
<form action="" method="GET">
<input type="password" name="password" id="">
<input type="text" name="text" id="">
<input type="submit" value="提交">
</form>
<form action="https://www.baidu.com/s" target="_blank" method="GET">
<input type="text" name="wd" placeholder="请输入内容">
<input type="submit" value="提交">
</form>
编辑器技巧(vscode或hbuilderX)
<!-- div*3 -->
<div></div>
<div></div>
<div></div>
<!-- div{content$}*3 -->
<div>content1</div>
<div>content2</div>
<div>content3</div>
<!-- ul>li{list$}*3 -->
<ul>
<li>list1</li>
<li>list2</li>
<li>list3</li>
</ul>
HTML学习笔记(一)——基础标签及常用编辑器技巧的更多相关文章
- 学习笔记—HTML基础标签
HTML的概念 概念: HTML 是用来描述网页的一种语言. HTML 指的是超文本标记语言 (Hyper Text Markup Language) HTML 不是一种编程语言,而是一种标记语言 ( ...
- HTML5学习笔记之表格标签
HTML5学习笔记之表格标签 其他HTML5相关文章 HTML5学习笔记之HTML5基本介绍 HTML5学习笔记之基础标签 HTML5学习笔记之表格标签 HTML5学习笔记之表单标签 HTML5学习笔 ...
- MAVEN学习笔记之基础(1)
MAVEN学习笔记之基础(1) 0.0 maven文件结构 pom.xml src main java package resource test java package resource targ ...
- Quartz学习笔记:基础知识
Quartz学习笔记:基础知识 引入Quartz 关于任务调度 关于任务调度,Java.util.Timer是最简单的一种实现任务调度的方法,简单的使用如下: import java.util.Tim ...
- Java后端高频知识点学习笔记1---Java基础
Java后端高频知识点学习笔记1---Java基础 参考地址:牛_客_网 https://www.nowcoder.com/discuss/819297 1.重载和重写的区别 重载:同一类中多个同名方 ...
- HTML+CSS学习笔记(4) - 认识标签(3)
HTML+CSS学习笔记(4) - 认识标签(3) 1.使用<a>标签,链接到另一个页面 使用<a>标签可实现超链接,它在网页制作中可以说是无处不在,只要有链接的地方,就会有这 ...
- HTML+CSS学习笔记(2) - 认识标签(1)
HTML+CSS学习笔记(2) - 认识标签(1) 1.语义化,让你的网页更好的被搜索引擎理解 标签的用途: 我们学习网页制作时,常常会听到一个词,语义化.那么什么叫做语义化呢,说的通俗点就是:明白每 ...
- MyBatis:学习笔记(1)——基础知识
MyBatis:学习笔记(1)--基础知识 引入MyBatis JDBC编程的问题及解决设想 ☐ 数据库连接使用时创建,不使用时就释放,频繁开启和关闭,造成数据库资源浪费,影响数据库性能. ☐ 使用数 ...
- bootstrap学习笔记之基础导航条 http://www.imooc.com/code/3111
基础导航条 在Bootstrap框中,导航条和导航从外观上差别不是太多,但在实际使用中导航条要比导航复杂得多.我们先来看导航条中最基础的一个--基础导航条. 使用方法: 在制作一个基础导航条时,主要分 ...
随机推荐
- [JAVA]移位运算(左移<<,右移>>和无符号右移>>>)
一.背景知识 整数在内存中是以二进制的形式存在的,而且存的是该整数的补码.最高位代表符号位,正数为0,负数为1 正数的补码是其二进制本身,负数的补码则是 符号位保持1不变,其他位按位取反再加1,+0和 ...
- if-else和三目运算符 ? : 的对比
今天的地铁思考让我想起一个之前学C语言的时候一直没有验证的事情:既生瑜何生亮? 平时写代码的时候,似乎并没有太多的关注我应该选用什么条件判断语句,感觉判断条件或者两条支路语句复杂就本能地if-else ...
- (数据科学学习手札89)geopandas&geoplot近期重要更新
本文示例代码及数据已上传至我的Github仓库https://github.com/CNFeffery/DataScienceStudyNotes 1 简介 最近一段时间(本文写作于2020-07-1 ...
- 数据可视化之powerBI技巧(十四)采悟:PowerBI中自制中文单位万和亿
使用PowerBI的时候,一个很不爽之处就是数据单位的设置,只能用千.百万等英美的习惯来显示,而没有我们中文所习惯的万亿等单位,虽然要求添加"万"的呼声很高,但迟迟未见到改进动作, ...
- 数据可视化之DAX篇(十)在PowerBI中累计求和的两种方式
https://zhuanlan.zhihu.com/p/64418286 假设有一组数据, 已知每一个产品贡献的利润,如果要计算前几名产品的贡献利润总和,或者每一个产品和利润更高产品的累计贡献占总体 ...
- CobaltStrike上线Linux主机(CrossC2)
一.简述 CrossC2插件是为企业和红团队人员提供的安全框架,支持 CobaltStrike 对其他平台的渗透测试(Linux / MacOS /...),支持自定义模块,并包括一些常用的渗透模块. ...
- 手写简易的Mybatis
手写简易的Mybatis 此篇文章用来记录今天花个五个小时写出来的简易版mybatis,主要实现了基于注解方式的增删查改,目前支持List,Object类型的查找,参数都是基于Map集合的,可以先看一 ...
- java 两个数组相减结果
public static void main(String[] args) { String[] a = new String[] { "1", "5", & ...
- js 对象数组根据某个名称删除数组中的对象
delArrayItem: function (array,item) { const index = array.findIndex(text => text.name === item.na ...
- OSCP Learning Notes - Capstone(1)
Kioptrix Level 1.1 Walkthrough Preparation: Download the virtual machine from the following website ...