HTML知识点总结还涉及一些subline的基本操作(有很多不足,现为初学者,以后补充)

news/2024/10/28 21:22:19/

标题一:HTML课堂笔记

文档结构说明(文档类型声明)
有7种文档类型

HTML4.0-4.1 strict,Transitional, Formset
html:xt/xs;对应严谨的或者不严谨的
严谨的HTML文档,可以丢一些东西,浏览器可以识别
XHTML1.0 strict,Transitional, Formset
严禁的HTML文档 所有的标记都要小写 一个符号都不能丢

HTML5

3.Sublimede的用法:
快捷键创建html(4.0-4.1-5)结构:html:xt,html:xs,html:5或者!+ tab;
a.不需要完整的输入一个标签,你只需要输入标签的名字,然后点击TAP键
b.Ctrl+鼠标滚轮:调整当前文档的显示字号大小
c.Ctr1+Shift+d:复制当前
d.Ctr1+Shift+k:删除当前行
e.标签名N 然后点击TAB键连续生成N个相同的标签
/遗漏一个知识点/
f.Ctr1+shift+↑/↓:上移/下移动当前行
h.按住滚轴不要去滚动它 往下拉
i.div>a>img 然后点击top <=>

<img src+"“alt+”"/>


k.li10>p>img 然后TAp键,end键可以直接到结尾

4.meta标签
a.声明当前页面所使用的字符串
<meta http-equiv=“Content-Type” content="text/
需要注意的是《一定要让你声明的当前网页所使用的编码格式与当前页面文件的保存格式一致,否则容易出现乱码
我们中文的世界里,目前才用的编码方式是:UTLF-8 GB2312

 b <meta name="description" content=""/>   给网站添加描述信息,便于搜索引纤搜索c. <meta name="keywords" content=""/>给网站添加搜索关键字5.在body体里出现的html标签,可以分成两大类:容器级--div·文本级--span(文字 图片 表单元素)

6.a标签
注意:"~"符号在ASP.NET里表示当前网络的根目录。但是这个符号对于HTML的相对路径来说不管用的
a.标签的第二种用法:锚点
点击我的著作…我的著作
name属性是标准用法,id也可以达到相同效果

7.ul标签:unordered list无序列表,他是用来表示一组语义相同的项
ul标签和li标签是组成出现的.换句话说ul不能脱离li,li也不能脱离ul
ul里只能放li
li里可以放任何东西,甚至可以在li里嵌套ul(掌握横着放li的操作)

8.ol标签:ordered list有序列表。他是用来表示一组语义相关的项
ol和ul一样,必须跟li标签组成出现
一般情况下,既然ul和ol都表示一组语义相同的项,所以我们喝少用ol;

9:dl定义列表
dl:definition list
dt:definition title
dd:definition description

标题二:HTML涉及的基本标签:

在这里插入代码片(subline中的HTML基本框架省略都是写入到,<body>  </body>
1.标题:我是标题<h1>我是标题</h1><h2></h2>.....<h5></h5>2:段落;<p> 我是段落</p>3:直线:<hr />(单向的)4:换行:<br />5:文本格式化标签:<b>咸蛋加粗</b>    <=>        <strong>加粗葱花蛋</strong>我是<i>倾斜</i>      <=>         <em>脉动</em>回来<s>原价:1888</s> 现价:19      <=>       <del> 原价:1999</del> 现价:88<u>特殊标志</u>        <=>       <ins>特殊标志</ins>一般都是用右边的6:图片插入(分三部分:同级(在一个文件夹)插入,html在上一级与html在下一级:最基本插入图片:<img src="文件的名称以及格式"  alt="如果图片没有显示出来则显示这一句话">(最基本)<img src="文件的名称以及格式"  title="当鼠标在图片上的时候显示这句话"  width ="宽度" height=“高度”  border="边框宽度">(最基本)高和宽一般指改变一个,一般图片都是比例存放。/ / / /  .../.../.../ 下一级与上一级表示方法7:链接标签:案例:  <a href="http://www.baidu.com" target="_blank">百度</a>(需要网络)<a href="连接的地址全名/其他的hteml文档/图片(本地不需要网络 网上的需要)/#" target="_blank">所创连接的名字</a>target="_blank"作用点击对应的连接是不关闭原本网页,而是在另一个打开。8:锚点定位:<a href="#live">3生命含义</a> 这是锚头<h3 id="live">生命含义:</h3>这是锚尾<a href="#自定义地址名称">自定义名称a</a><h3 id="与锚头一致">点击自定义a可以直接到对应的锚尾;id  <=>  name
9:div span:<div>我是布局=我占满一整行</div><div>我是布局=我占满一整行i</div><span>我不限制我一行可以放多个</span><span>我不限制</span>10:base标签不是放到<body> </body><head><meta charset="UTF-8"><title>无敌蛋蛋</title>/*网页名称*/<base target="_blank" /></head>
11.特殊字符(有很多可以自己去找,以后会补充)<h3>-------&nbsp;&nbsp;特殊字符&nbsp;&nbsp;-------</h3>我们的段落符号是:&lt;p&gt;段落&lt;/p&gt;
12:注释标签相当于C中/**/<!--关于注释我有几点说的注释<br />-->
13:相对路径:<h3>相对路径:</h3> <br />
<!--在一个文件夹--><img src="06.jpg" alt="这是大头贴"><img src="imget/05.jpeg" /><!--html文件在上一层--><img src="../前端案例/07 案例 .html" alt=""><!--../表示上一级,一个就往上上一级-->
<h3>绝对路径:</h3><br />
1:本地<br />  <!--不经常用或者不用/!-->
2:网络(需要连接网络): <br /> <!--经常用-->
<img src="https://ps.ssl.qhimg.com/sdmt/203_162_100/t01f3d2dbeeea099a7b.webp" alt="#">
14:ul(无序表)与ol(有序表(一般不用))<h3>你喜欢的水果:</h3><ul>盒子<!--ul标签里只能放li标签,但是li标签里可以放别的/!--><li>苹果</li><li>香蕉</li><li>橘子</li><li>火龙果</li><li>蓝莓</li><li>樱桃</li><li><p><h3>水果蔬菜</h3></p><br /><p>西红柿</p></li> </ul><!--有序表/!--><ol>盒子<li>美国</li><li>英国</li><li>中国</li><li>俄罗斯</li><li>鸭蛋</li><li>蛋蛋</li></ol>
15:自定义列表
<dl>盒子<dt>北京</dt>要解释的名词放到<dt></dt>中<dd>昌平</dd>解释的含义放到<dd></dd>中<dd>通州</dd><dd>顺义</dd><dd>海淀</dd></dl>

http://www.ppmy.cn/news/629293.html

相关文章

phpstorm2019安装和使用

http://www.3322.cc/soft/50361.html PhpStorm 2019专门用户制作PHP集成开发软件&#xff0c;全新的版本拥有许多改变。有了这款软件&#xff0c;你就可以随时随地的对编码进行更改编辑。拥有最智能的javascript编辑器&#xff0c;提供代码完成、验证和快速修复、重构、JSDoc类…

html css javascript

结构 <!DOCTYPE html> <html> <head> <meta charset"utf-8"> <title>文档标题</title> </head> <body> <h1>我是第一个标题</h1> <p>我是第一个段落。</p> </body> </html…

1.Linux命令行使用技巧

1.Linux命令行使用技巧 1.什么是linux&#xff1f; GNU/Linux是Linux的全称&#xff0c;GNU是开源组织&#xff0c;Linux是指Linux内核。 内核&#xff1a;系统核心程序&#xff0c;相当于人的大脑&#xff0c;负责系统程序和硬件分配及调度。 2.什么是shell&#xff1f; shel…

4.vim高级用法配置

4.vim的高级用法配置 无图形界面分为 0-6 个运行等级&#xff0c;0 代表关机&#xff0c;6 表示重启&#xff0c;1 代表单用户模式&#xff0c;只有一个 root 用户&#xff0c;相当于 Windows 的安全模式&#xff1b;2-4 表示无图形网络模式&#xff0c;5 代表有图形的网络模式…

Linux基本命令 目录与文件

当前目录和上层目录&#xff1a; ./ ../主目录&#xff1a; ~/pwd — 打印出当前工作目录名cd — 更改目录ls — 列出目录内容使用命令 type – 说明怎样解释一个命令名. 显示命令的类型which – 显示会执行哪个可执行程序. 显示一个可执行程序的位置help – 得到 shell 内建…

MySQL数据库——存储过程

MySQL数据库——存储过程 一、MySQL存储过程概念二、存储过程1.创建存储过程2.调用存储过程3.查看存储过程4.存储过程的参数5.删除存储过程 三、存储过程的控制语句1.条件语句if-then-else end if2.循环语句while end while 一、MySQL存储过程概念 存储过程是一组为了完成特定…

VBA快速入门学习笔记

NOTE 1&#xff1a; 一、VBA对象 工作簿、工作表、单元格、批注、透视表、自选图形、名称等等都是对象&#xff0c;VBA正是用于处理这些对象的语言。下图是一个比较经典的VBA对象类别图。在VBE&#xff08;VB编辑器&#xff09;里也可以看到对象的浏览器&#xff08;F2键&…

魔改合成大西瓜,从源码到部署,步骤详细

现在有一款火爆全网的小游戏《合成大西瓜》&#xff0c;据官方数据显示&#xff0c;目前参与合成西瓜的游玩人次已经多达六千多万&#xff0c;可见广大网友已经不仅仅满足于在娱乐圈吃瓜了&#xff0c;现在更喜欢自己创造大西瓜&#xff0c;哈哈哈。 前一段时间看朋友圈里有好…