18 12 23 html 基本学习

一个html的基本结构如下:

<!DOCTYPE html>
<html lang="en">
    <head>            
        <meta charset="UTF-8">
        <title>网页标题</title>
    </head>
    <body>
          网页显示内容
    </body>
</html>

在sublime中打出  !  加 tab 键可以调出

html标题标签

<h1>这是一级标题</h1>
<h2>这是二级标题</h2>
<h3>这是三级标题</h3>

html段落标签、换行标签与字符实体

<p>标签定义一个文本段落,一个段落含有默认的上下间距,段落之间会用这种默认间距隔开

代码中成段的文字,直接在代码中回车换行,在渲染成网页时候不认这种换行,如果真想换行,可以在代码的段落中插入<br />来强制换行,

html块标签、含样式的标签

1、<div> 标签 块元素,表示一块内容,没有具体的语义。
2、<span> 标签 行内元素,表示一行中的一小段内容,没有具体的语义

1、<em> 标签 行内元素,表示语气中的强调词
2、<i> 标签 行内元素,表示专业词汇
3、<b> 标签 行内元素,表示文档中的关键字或者产品名
4、<strong> 标签 行内元素,表示非常重要的内容

语义化的标签,就是在布局的时候多使用有语义的标签,搜索引擎在爬网的时候能认识这些标签,理解文档的结构,方便网站的收录。比如:h1标签是表示标题,p标签是表示段落,ul、li标签是表示列表,a标签表示链接,dl、dt、dd表示定义列表等,语义化的标签不多

html图像标签

<img>标签可以在网页上插入一张图片,它是独立使用的标签,它的常用属性有:

  • src属性 定义图片的引用地址
  • alt属性 定义图片加载失败时显示的文字,搜索引擎会使用这个文字收录图片、盲人读屏软件会读取这个文字让盲人识别图片,所以此属性非常重要。
  • “ ./ ” 表示当前文件所在目录下,比如:“./pic.jpg” 表示当前目录下的pic.jpg的图片,这个使用时可以省略。

  • “ ../ ” 表示当前文件所在目录下的上一级目录,比如:“../images/pic.jpg” 表示当前目录下的上一级目录下的images文件夹中的pic.jpg的图片

html链接标签

<a>标签可以在网页上定义一个链接地址,它的常用属性有:

  • href属性 定义跳转的地址
  • title属性 定义鼠标悬停时弹出的提示文字框
  • target属性 定义链接窗口打开的位置
    • target="_self" 缺省值,新页面替换原来的页面,在原来位置打开
    • target="_blank" 新页面会在新开的一个浏览器窗口打

有序列表

在网页上定义一个有编号的内容列表可以用<ol>、<li>配合使用来实现

无序列表

在网页上定义一个无编号的内容列表可以用<ul>、<li>配合使用来实现

猜你喜欢

转载自www.cnblogs.com/fromlantianwei/p/10163373.html
今日推荐