H5学习入门

Posted 2020-09-21 Hei_Man

【块级标签与行级标签的区别】

1.块级标签： 默认宽度100%（独占一行）

自动换行(右边不能有任何东西)

可以使用css设置宽度高度

 

2.行级标签： 内容宽度，由内容撑开(内容多宽，宽度就占多宽)

不会自动换行(从左往右依次排列)

 

【常见的行级标签】

span（文本）

img（图片）

em（强调）

strong（强调）

q（短引用）

a（超链接）

i（倾斜）

b（加粗）

small（缩小字体）

【em/strong i/b】区别

①em和i都能倾斜，strong和b都能加粗，但是，i和b仅仅是单纯的倾斜，em与strong多了强调的语义

②em和strong都表示强调，但是strong强调的级别更高

注意： 强调的目的，让1搜索引擎知道网页的重点内容，但与搜索引擎检索

strong和em都可以多层嵌套，表示强调程度的递增

三大引用标签

<q cite="http://www.baidu.com">百度</q>

q标签：表示短引用

cite属性：用于声明引用的来源

 

<blockquote cite="http://www.baidu.com">用于引用一段内容</blockquote>

<cite cite="">引用作品名，书画名</cite>

相同点：三大引用标签，都用cite声明引用来源

不同点：1.引用的内容不同

q->一句话 blockquote->一段话 cite->作品名

2.显示的默认效果不同

blockquote->默认整段向右缩进

q->默认加引号

cite->默认倾斜

img

相对路径：

1.图片与当前文档在同一层文件夹,直接写图片名

<img src="icon.jpg">

2.图片在当前文档的下一层文件夹，文件夹名/图片名

<img src="img/icon.jpg">

3.图片在当前文档的上一层文件夹，../图片名(../表示后退一层)

<img src="../icon.jpg">

图片必须包含在项目里面，不能访问项目外的图片

align:

top->图片顶部，center->图片居中，bottom->图片底部