单词缩写: head 头部. 标题 title 文档标题
为了使网页更具有语义化,我们经常会在页面中用到标题标签,HTML提供了6个等级的标题,即
标题标签语义: 作为标题使用,并且依据重要性递减
其基本语法格式如下:
小结 :
单词缩写: paragraph 段落 [ˈpærəgræf]无须记这个单词
作用语义:
可以把 HTML 文档分割为若干段落
在网页中要把文字有条理地显示出来,离不开段落标签,就如同我们平常写文章一样,整个网页也可以分为若干个段落,而段落的标签就是
是HTML文档中最常见的标签,默认情况下,文本在一个段落中会根据浏览器窗口的大小自动换行。
单词缩写: horizontal 横线[ˌhɔrəˈzɑntl]同上
在网页中常常看到一些水平线将段落与段落之间隔开,使得文档结构清晰,层次分明。这些水平线可以通过插入图片实现,也可以简单地通过标签来完成,<hr />就是创建横跨网页水平线的标签。其基本语法格式如下:
在网页中显示默认样式的水平线。
单词缩写: break 打断 ,换行
在HTML中,一个段落中的文字会从左到右依次排列,直到浏览器窗口的右端,然后自动换行。如果希望某段文本强制换行显示,就需要使用换行标签
这时如果还像在word中直接敲回车键换行就不起作用了。
div span是没有语义的 是我们网页布局主要的2个盒子 想必你听过 css+div
div 就是 division 的缩写 分割, 分区的意思 其实有很多div 来组合网页。
span 跨度,跨距;范围
语法格式:
他们两个都是盒子,用来装我们网页元素的, 只不过他们有区别,现在我们主要记住使用方法和特点就好了
要回家了有点按捺不住心里的躁动,来点简单轻松的话题。
这是个有趣的问题,应该有不少人搜过,我也搜过。出现这个问题主要还是滥用块级元素,或者是不会使用一些小技巧。举个例子,有时候我们想实现如下表单效果:
但有时候写着写着会变成下面的样子:
按我从以前遇到过情况来说,出现上面的情况的原因,可能有2个:
第一,就是可能在某个地方<label>被设置块级元素包住了
解决方法: 在外部样式使用 display: inline-block
第二,就是<label>的样式使用了 display: block
所以如果以后在写表单的时候,出现这个问题,可以从上面2个方向去查找原因,以及找出相应的解决方法。
(1)、<!DOCTYPE>声明位于位于HTML文档中的第一行,处于 <html>标签之前。告知浏览器的解析器用什么文档标准解析这个文档。DOCTYPE不存在或格式不正确会导致文档以兼容模式呈现。使用 <!Doctype>会让文档中的所有盒子模型以w3c标准盒子模型呈现。
(2)、标准模式的排版 和JS运作模式都是以该浏览器支持的最高标准运行。在兼容模式中,页面以宽松的向后兼容的方式显示,模拟老式浏览器的行为以防止站点无法工作。
在HTML与CSS的标准化未完成之前,各个浏览器对于HTML和CSS的解析有各自不同的实现,而有很多旧的网页都是按照这些非标准的实现去设计的。在HTML与CSS标准确定之后,浏览器一方面要按照标准去实现对HTML与CSS的支持,另一方面又要保证对非标准的旧网页设计的后向兼容性。因此,现代的浏览器一般都有两种渲染模式: 标准模式 和 怪异模式 。在 标准模式 下,浏览器按照HTML与CSS标准对文档进行解析和渲染;而在 怪异模式 下,浏览器则按照旧有的非标准的实现方式对文档进行解析和渲染。这样的话,对于旧有的网页,浏览器启动怪异模式,就能够使得旧网页正常显示;对于新的网页,则可以启动标准模式,使得新网页能够使用HTML与CSS的标准特性。
Reference1 - h5新增标签
Reference2 - HTML元素分类
Reference3 - html标签分类及常用元素
Reference4 - HTML5常用标签分类
表格1、<table></table>:声明一个表格,所有表格的内容应该放在table标签内
属性:
border:表示边框是否显示
width:表格的宽度
height:表格的高度
cellpadding:单元格边框和内容之间的补白
cellspacing:单元格和单元格之间的补白
align:表格的位置
值:
left:默认值 左对齐
center:居中
right:右对齐
2、<caption></caption>:表格的标题
3、<thead></thead>:表格的表头
4、<tbody></tbody>:表格的主体
5、<tfoot></tfoot>:表格的底部
6、<tr></tr>:表格的行
7、<td></td>和<th></th>:
表格的单元格
th修饰的单元格内容会加粗
属性:
colspan:横跨列,值为要横跨的列数 左到右
rowspan:横跨行,值为要横跨的行数 上到下
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)