澳门永利备用网址HTML基础知识(常见成分、列表、链接成分、图片成分)

1、HTML有关概念

万事俱备: Hyper Text 马克up Language(超文本标识语言)
其文件扩充名叫“.html”或“.htm”

     * 超文本 – 在普通的文本基础上,增多超链接、图片、音频或录像等

     * 标识 – 标识正是HTML中的标签(成分),特点:<a>

* 语言 – 近年来目的所能识别的

本子: HTML 4.01 <4.01与4.0不是二个本子>; HTML 5;
XHTML:严酷版本的HTML

  • Ø 基本构造:

 澳门永利备用网址 1

 附:<!doctype html>:
表明版本,则浏览器能够优先领会文书档案类型,进而不利突显网页内容

<meta charset=”UTF-8″> : 设置编码格式

meta标签提供了元数据(不出示在页面上,但会被浏览器分析)。

meta成分常用于内定网页的描述、关键词、文件的末段修改时间、作者、和其余元数据。元数据可使用浏览器(怎么着显示内容或重复加载页面),寻找引擎(关键词),或别的Web服务。

eg:为寻找引擎定义关键词、为网页定义内容、为网页定义作者….

<meta name=”keywords” content=”HTML, CSS, XML, XHTML, JavaScript”>

<meta name=”description” content=”Free Web tutorials on HTML and
CSS”>

<meta name=”author” content=”King”>

  • Ø 元素

空成分 – 独有初步标签,未有停止标签;

开首成分 – 具备起初标签和了结标签 —–成对出现

注: 成分名(大小写均可)- W3C预约义,建议利用小写

  • Ø 属性

效率:定义当前因素的音讯            格式:属性名=”属性值”  

(a.属性必得定义在最早标签中   b.同一个要素具有八个属性)

i   通用属性 – 差非常的少具备的HTML成分都独具的性子

  id: 表示近日成分的标记(独一的)        name: 表示近些日子因素的名号

  style: 表示定义CSS样式              class: 表示定义CSS样式

i 私有属性 – 有些成分独有的特性

  • Ø 注释

功能:解释当前的成分的功能          特点:不会来得在浏览器的页面中

  格式:<!– 注释内容 –>               快捷键:CT猎豹CS6L + ?

2、HTML常见成分

ü  标题 <h1> ~ <h6> (常用的<h1> ~
<h3>,尤其是<h1>)

       <h1>:用于寻觅引擎抓取HTML页面

查找引擎抓取HTML内容时,优先级:

      <title>元素中的内容 大于 <meta name=”keywords”
content=””>大于<h1>元素

ü  段落 <p></p>   

特点:自动换行,行间距非常大

eg:  <p> </p>  <p></p>

   或  <p> </p>

澳门永利备用网址 2

<p> </p>

eg: <p> <br> </p> 

 澳门永利备用网址 3

ü  <hr> – 水平线       

ü  <br> – 换行      [快捷键 – 标签名 + TAB]

3、列表

(1)有系列表      (2)冬辰列表        (3)定义列表

      <ol>             <ul>              <dl>     
   – 表示定义列表

         <li></li>         <li></li>       
  <dt></dt>   – 表示列表项(列表的标题)

      </ol>             </ul>           
   <dd></dd>  – 表示列表项的叙说(列表项)

                                             </dl>

 澳门永利备用网址 4

有系列表 type属性:规定列表类型1、A、a、l、i; start属性:规定初始数字

快捷键:标签:*数据 + TAB;   alt+鼠标左键

4、链接成分

   格式:<a href=” “></a>

   属性:<a href=”当前要跳转到的地址”></a>     <a
name=”当前因素的名称”></a>

a链接会自水肿划线,若去除下划线,则  a{ text-decoration: none;}

href:去往的渠道即跳转的页面(必写属性)

title:提示文本,相当于鼠标放到链接上彰显的文字

target = ’_self ’   
暗中认可值,在自家页面展开(关闭本身页面,张开链接页面) 

target = ’_blank ’  张开新页面 (自己页面不闭馆,展开三个新的链接页面)

效率: 完结页面跳转(默许);
完成回到顶上部分[锚点(#name)]即指向某定点地方;完结殡葬邮件

eg: <a name=”top”>那是下边</a>

    <a href=”mailto:82328769@qq.com” >邮箱地址</a>

    <a href=”#top” >回到顶端</a>      <a href=”#middle”
>回到中间</a>

² 相对路线

即相对于文件自个儿出发,便是相对路线。

文本和图纸(html文书档案)在同三个目录(文件夹) ,直接写文件名。

 澳门永利备用网址 5

图表(html文书档案)在文件在下一流目录里。文件夹名称/图片(html)名称

 澳门永利备用网址 6

图表(html)在文书的上一流目录里,.. /图片(html)名称

 澳门永利备用网址 7

图表在文件的上一流的其余目录里,../文件夹名称/图片名称

 澳门永利备用网址 8

²  相对路线

澳门永利备用网址 9

澳门永利备用网址 10

5、图片成分

<img src=”当前引进图片的不二等秘书技”  alt=” text文本”  width=”图片宽度”
 height=”图片中度” >

                           图片元素的加载原理

澳门永利备用网址 11