HTML 的四大内容标签

  • Post author:
  • Post category:其他

HTML 中的内容标签 1、标题(网页的内容标题)分6级 2、段落 3、超链接 4、图片

标题标签:<h1></h2>…<h6></h6> 1.字体加粗 2.字号规定 3.独立成行 (不论内容多少 自己独占一行)

段落标签:<p></p> 1.独立成行 注:如果只有一行字还是用上段落标签,方便以后对文字进行改变

这前俩个就不实现了就是标题大小改变和内容,还是看后面俩个。

超链接标签:<a><\a> 标签的属性 href (超链接必备属性):规定跳转地址->服务器地址或者本地地址 target 新页面的展示位置 target=”_blank” 保持当前页面不动打开新的页面

<a href = “http://www.baidu.com” target =”_blank”>百度<\a>

不独立成行

图片标签

插入网络图片
单标签 <img src = “”>  src(必备属性) 表示图片的来源路径

alt 图片路径出错时,给用户的提示文字,当图片正常显示的时候alt属性就不展示了

title 当鼠标放入图片时,提示文字

width 宽度
height 高度 单位是像

用例:

<img src =”https://www.baidu.com/img/PCtm_d9c8750bed0b3c7d089fa7d55720d6cf.png” 
alt = “对不起图片不存在了”  title =”这是百度的logo” width =200 higth =250>

发散思维:

将图标用来作超链接

<a  href = “www.baidu.com”  target = “_blank”>
<img src =”https://www.baidu.com/img/PCtm_d9c8750bed0b3c7d089fa7d55720d6cf.png” 
alt = “对不起图片不存在了”  title =”这是百度的logo” width =200 higth =250>

</img>
</a>

源码:

<!DOCTYPE html>
<html   >
    <head>
   <meta charset =”UTF-8″ >
  <title>
      4大标签页面
</title>
    </head>
     <body>
    <h1 style = “color: green”>
      超链接加图片
    </h1>
<a  href = “www.baidu.com”  target = “_blank”>
<img src =”https://www.baidu.com/img/PCtm_d9c8750bed0b3c7d089fa7d55720d6cf.png” 
alt = “对不起图片不存在了”  title =”这是百度的logo”>

</img>
</a>

    </body>

</html>

 


版权声明:本文为weixin_51182359原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。