HTML5技术

HTML的基本结构与标签的初步了解 - 君无药(2)

字号+ 作者:H5之家 来源:H5之家 2017-06-13 18:02 我要评论( )

① em和i都能倾斜。strong和b都能加粗!但是,i和b仅仅是单纯的倾斜加粗,而em和Strong多了强调的语义。 ② em和strong都表示强调,但是strong强调的级别更高!! 注意: 1、强调的目的:让搜索引擎知道网页重点强

① em和i都能倾斜。strong和b都能加粗!但是,i和b仅仅是单纯的倾斜加粗,而em和Strong多了强调的语义。
② em和strong都表示强调,但是strong强调的级别更高!!
注意:
1、强调的目的:让搜索引擎知道网页重点强调的内容!便于搜索引擎显示!
2、Strong和em都可以多层嵌套,表示强调程度的递增!

 

(3)短引用标签q:表示短引用 。       cite属性:用于声明引用的来源。

常用的引用标签】
<blockquote>用于引用一段内容</blockquote>
<q>用于引用一句话</q>
<cite>常用于引用作品名、书画名等</cite>

相同点:三个引用标签,都用cite属性表示引用来源
不同点:① 引用的内容不同。      blockquote->一段话,q->一句话,cite->作品名
② 显示的默认效果不同。    blockquote->默认整段向右缩进;     q->默认加引号;   cite->默认倾斜!

 

(4)缩小标签small:将字体缩小一号;big标签:将字体放大一号。

注意:
① small和big可以多层嵌套,直到字体达到最小或最大为止;
② 这俩标签已经被淘汰,并不建议使用。

(5)图片标签img 

① src属性:表示图片的路径
[图片路径的合法方式]
A.网络链接:由于图片在其他网站,如果其他网站删除图片,我们也不能访问,所以不建议使用这种方式;
<img src="https://www.baidu.com/img/bd_logo1.png" />


B.绝对路径:使用绝对路径的图片,只有在本机使用file协议才能访问!所以,严禁使用这种方式!
<img src="file:///E:/icon.jpg" />


C.相对路径:
a、 图片与当前文档在同一层文件夹:直接写图片名
<img src="icon.jpg" />
b、图片在当前文档的下一层文件夹:文件夹名/图片名
<img src="img/icon.jpg" />
c、 图片在当前文档的上一层文件夹: ../图片名 (../表示后退一层)
<img src="../icon.jpg" />
但是,一定要注意:图片必须包含在项目里面,不能访问项目外的图片。


② height:图片的高度 width:图片的宽度
<img src="img/icon.jpg" />

③ title:图片的标题,也就是鼠标指上后看到的提示文字
<img src="img/icon.jpg" title="鼠标指上后看到的提示文字" />

④ alt: 图片无法加载时显示的文字
<img src="img/icon.jpg" alt="图片无法加载时显示的文字" />

⑤ align:图片周围的文字相对于图片如何对齐。
可选值:top->图片顶部 center->图片中部 bottom->图片底部
<img src="img/icon.jpg" />12345

(6)超链接标签a

A、href属性:表示超链接跳转的页面。
① 可以写网络地址:
<a href="http://www.baidu.com">这是一个超链接</a>


② 可以打开本地的html文件:
采用相对路径确定文件地址。与img标签确定方式相同。
<a href="01-HTMLhead部分index.html">这是一个超链接</a>


B、title属性:鼠标指上后显示的提示文字
<a href="01-HTMLhead部分index.html"title="ttt">这是一个超链接</a>

C、target属性:设置新页面打开的窗口位置
可选值:_self自身页面打开(默认)
_blank 新窗口打开
<a href="01-HTMLhead部分index.html"target"_blank">这是一个超链接</a>

超链接的特殊应用
1、功能性链接:(了解)
mailto:// 点击链接给指定邮箱发送邮件
<a href="mailto://jianghao@jerei.com"target"_blank">点击发送邮件</a>
tencent://message/?uin=1105093212"
还有:tell://手机端点击打电话
message://手机端点击发送短信
ftp://使用ftp协议进行文件的上传下载
2、锚点链接
>>>本页面锚链接
① 在页面的指定位置中设置一个锚点,用那么属性表示锚点名字:
a></a>
<div></div>
② 将超链接的href属性,设置为#加锚点名字
<a href="#top">点击链接,跳转到top锚点位置</a>
>>>页面间锚链接
① 在新页面的指定位置中设置一个锚点,用那么属性表示锚点名字:
a></a>
<div></div>
② 将超链接的href属性,设置为“新页面地址#加锚点名字”:
<a href="锚点.html#3">点击链接,跳转到锚地.html的top锚点位置</a>

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • 4.HTML中实现鼠标经停时整行(tr)变色 - ITCSJ

    4.HTML中实现鼠标经停时整行(tr)变色 - ITCSJ

    2017-06-14 08:00

  • Html5拖放 - SailrMoon

    Html5拖放 - SailrMoon

    2017-06-13 17:00

  • 利用gulp对项目html,js,css,图片进行压缩 - 紫竹玉龙

    利用gulp对项目html,js,css,图片进行压缩 - 紫竹玉龙

    2017-06-07 17:02

  • WebSocket+MSE——HTML5 直播技术解析 - 又拍云

    WebSocket+MSE——HTML5 直播技术解析 - 又拍云

    2017-06-07 17:00

网友点评