ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

1.网页标签

2022-08-01 17:04:19  阅读:164  来源: 互联网

标签:网页 标记 标签 html 跳转 网页内容 页面


1.什么是html? TML的全称为超文本标记语言,是一种标记语言。它包括一系列标签.通过这些标签可以将网络上的文档格式统一,使分散的Internet资源连接为一个逻辑整体。HTML文本是由HTML命令组成的描述性文本,HTML命令可以说明文字,图形、动画、声音、表格、链接等。
支持HTML5的浏览器:微软、google、苹果、Opera、Mozilla、(支持跨平台、市场需求基本都可以)
一、W3c标准: 1.html网页结构。类似房子主体 2.网页美化。类似房子装修 3.JavaScript(js):网页交互
<!-注释标签->  解释说明、浏览器不显示: css的注释://注释   /*注释*/
二、html的结构:
<!DOCTYPE html>  <!--告诉浏览器当前文件采用HTML文本编写-->
    <head>
        <!--设置字符的编码utf-8-->
        <meta charset="utf-8">
        <!--网页三要素:标题、关键字、描述-->
        <title>标题标签</title>  
        <!--设置网页的搜索关键字,content里写搜索的关键字,用,分隔开-->
        <meta name="Keywords" content="填写关键字">
        <!--设置网站的的描述,content里写网站的说明-->
        <meta name="Description" content="描述">
    </head>
    <!--网页显示的内容-->
    <body>
        <!--网页内容标:h1-h6-->
        <h1>网页内容标题1</h1>
        <h2>网页内容标题2</h2>
        <h3>网页内容标题3</h3>
        <h4>网页内容标题4</h4>
        <h5>网页内容标题5</h5>
        <h6>网页内容标题6</h6>
    </body>
</html>
4、段落标签:
   <p>段落标签</p><!--单独占一行-->
        <!--李白的静夜思为例-->
         <h3>《静夜思》</h3>
        <p>床前明月光,疑是地上霜。举头望明月,低头思故乡</p>

5、水平分割线 :<hr>

6、换行标签<br/>

7、字体标签:

  <font> 规定文本的字体、字体尺寸、字体颜色。
    <标签名 属性1 = “属性值1” 属性2 = “属性值2” 属性3 = “属性值3” 。。。>  内容   </标签名>
  <em>强调字体为斜体
  <i>斜体 <b>粗体
  <strong>加粗字体

8、img标签

图片标签img用于在HTML页面添加图片
img标签的src和alt两个重要属性,src属性用于指定图片的路径,alt属性用于设置图片的默认信息、还要 title属性是:鼠标悬停在图片上的时候时候显示的字。 
<img src=“图片的路径” alt="图片的信息描述" title="鼠标停在图片上的时候时候显示的字"/>
<img src=“D:/webDemo/images/长城.jpg” alt="长城的远观图" title="鼠标悬停在图片上的时候时候显示的字"/> 

  9、超级链接

<h3>图像超级链接:</h3>
        <!--图像超级链接-->
        <a href="wecome.html" target="_blank"> 
            <img src="img/01.jpeg" width="500" alt="欢迎来到这个世界"  title="世界"/>
        </a>
        <p>
        <!--文本超级链接-->
        <a href="wecome.html" target="_blank" >欢迎来到这个世界 </a>
        </p>
   

  10、邮件链接:

   <a href="mailto:123456789@163.com">联系我们</a>   详细说下a标签:

1、href="#"的作用:页面中有滚动,可以直接回到顶部。

<a href="#">回到顶部</a>  

2、href="url"的作用

1)url为绝对路径

//跳转到百度页面
<a href="http://baidu.com">跳转到百度网</a>

2)URL为相对路径

<a href="/img/xx.img">图片链接</a>

3)锚点

页内跳转

//点击此处会跳到标记1
<a href="#1">锚点1</a>
//点击此处会跳到标记2
<a href="#2">锚点1</a>

<div id="1">标记1</div>
<div id="2">标记2</div>

页外跳转

假如有xx1.html,xx2.html

xx1.html
//此时就会跳转到2.html的标记1处 <a href="xx2.html/#1">锚点1</a> <div id="1">标记1</div> 2.html <div id="1">标记1</div>

3、href="JavaScript:;"(javascript:是伪协议,它可以让我们通过一个链接来调用javascript函数.而采用这个方式 javascript:;可以实现A标签的点击事件运行时,如果页面内容很多,有滚动条时,页面不会乱跳,用户体验更好)

//void是一个操作符,void(0)返回undefined,地址不发生跳转,会执行onclick里面的方法
<a href="javascript:void(0)" onclick="subFtion();">停在当前页面</a>
//#是标签内置的一个方法,代表top的作用。点击网页后返回到页面的最顶端。
<a href="#" onclick="subFtion();">返回顶部</a>
//js函数后return false,页面不发生跳转,执行后还是在页面的当前位置
<a href="#" onclick="subFtion();return false;">停在当前页面</a>

标签:网页,标记,标签,html,跳转,网页内容,页面
来源: https://www.cnblogs.com/aure/p/16540800.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有