Web前端开发简明教程
首页 > Web前端开发简明教程 > 2.4 标签与标签的使用

2.4 标签与标签的使用

2020-10-12 17:34:57 31 0

编辑 收藏

2.4 <div>标签与<span>标签

<div>标签可定义文档中的分区或节(division/section), div元素没有特定的含义,是一个块元素。div元素可用于文档布局,另外与css一起对大的内容块设置样式属性。例2-11演示了通过div与CSS一起设置文本的样式。

例2-11 2-11.html

<! DOCTYPE html>      <html>          <head>          <meta charset="gb2312"/>          <title>哪些大学可报考大数据专业?2017年大数据专业就业前景-@云创大数据</title>          <meta name="keywords" content="哪些大学可报考大数据专业?2017年大数据专业就  业前景"/>          <meta name="Description" content="据教育部数据显示,目前,全国已有35所高等  院校开通了大数据专业。也就是说,高考报志愿可直接报大数据专业的学校了。那么,哪些大学可以报  考大数据专业呢?大数据专业的就业前景如何呢?<br>      "/>      </head>      <body>      <div style="font-size:14px; color:#2b2b2b; text-align:left; line-height:  26px; ">  &nbsp; &nbsp; &nbsp; &nbsp;作者|笑面虎(本文为36大数据专稿)</div>        <div style=" font-size:14px; color:#2b2b2b; text-align:left; line-height:  26px; ">  &nbsp;  &nbsp; &nbsp; &nbsp;据数联寻英发布《大数据人才报告》显示,目前全国的  大数据人才仅46万,未来3~5年内大数据人才的缺口将高达150万。据职业社交平台LinkedIn发  布的《2016年中国互联网最热职位人才报告》显示,研发工程师、产品经理、人力资源、市场营销、运  营和数据分析是当下中国互联网行业需求最旺盛的六类人才职位。其中研发工程师需求量最大,而数据  分析人才最为稀缺。领英报告表明,数据分析人才的供给指数最低,仅为0.05,属于高度稀缺。数据分  析人才跳槽速度也最快,平均跳槽速度为19.8个月。</div>      </body>      </html>

在例2-11中,通过div元素的style属性为div设置文字大小为14 px,设置了文字颜色,设置文本水平对齐方式为左对齐,设置行高为26 px。例2-11在浏览器中的显示效果如图2-6所示。

epub_22651130_14.jpg  

图2-6 例2-11在浏览器中的显示效果

另外通过在页面上放置多个div并定义好每个div的位置(div的位置确定了,div中包含的段落、图片等内容也就随div确定了在网页上的位置)及大小可以达到给网页布局的效果。

span元素是行内元素,span元素也没有特定的含义。其主要使用场合是与CSS一同使用,为部分文本设置样式属性。如下面的代码将“*”设置为红色:

<span style="color:red; ">*</span>请输入密码:

具体显示效果请读者自己输入代码在浏览器中查看。

TAGS:前端教程

取消回复欢迎 发表评论: