网站开发html_网页基础代码大全

网站开发html_网页基础代码大全网页的标准是W3C,目前模式是HTML、CSS和JavaScript。HTML标签<!DOCTYPEHTML>是文档声明,必须写在HTML文档的第一行,位于<html>

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE使用 1年只要46元 售后保障 童叟无欺

网页的标准是W3C,目前模式是HTML、CSS和JavaScript。

HTML,全称“Hyper Text Markup Language(超文本标记语言)”,简单来说,网页就是用HTML语言制作的。HTML是一门描述性语言,是一门非常容易入门的语言

CSS,全称“(层叠样式表)”。以后我们在别的地方看到“层叠样式表”、“CSS样式”,指的就是CSS

HTML是网页的结构,CSS是网页的外观,而JavaScript是页面的行为

HTML 标签

1. 在HTML中规定标签使用英文的的尖括号即`<`和`>`包起来,如`<html>`、`<p>`都是标签。 2. HTML中标签**通常**都是成对出现的,分为开始标签和结束标签,结束标签比开始标签多了一个`/`,如`<p>标签内容</p>`和`<div>标签内容</div>`。开始标签和结束标签之间的就是标签的内容。 3. 标签之间是可以嵌套的。例如:div标签里面嵌套p标签的话,那么`</p>`必须放在`</div>`的前面。 4. HTML标签不区分大小写,`<h1>`和`<H1>`是一样的,但是我们通常建议使用小写,因为大部分程序员都以小写为准。


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

</body>
</html>

<!DOCTYPE HTML>是文档声明,必须写在HTML文档的第一行,位于<html>标签之前,表明该文档是HTML5文档。

  1. <html></html> 称为根标签,所有的网页标签都在<html></html>中。
  2. <head></head> 标签用于定义文档的头部,它是所有头部元素的容器。常见的头部元素有<title><script><style><link><meta>等标签,头部标签在下一节中会有详细介绍。
  3. <body></body>标签之间的内容是网页的主要内容,如<h1><p><a><img>等网页内容标签,在<body>标签中的内容(图中淡绿色部分内容)最终会在浏览器中显示出来。

HTML文档包含了HTML标签及文本内容,不同的标签在浏览器上会显示出不同的效果,所以我们需要记住最常见的标签的特性



head标签


我们首先来介绍一下head标签的主要内容和作用,文档的头部描述了文档的各种属性和信息,包括文档的标题、编码方式及URL等信息,这些信息大部分是用于提供索引,辩认或其他方面的应用(移动端)的等。 以下标签是可以用在head标签中的:

 
<head lang='en'>
    <title>标题信息</title>
    <meta charset='utf-8'>
    <link>
    <style type='text/css'></style>
    <script type='text/javascript'></script>
</head>

title标签

<title>标签:在<title></title>标签之间的文字内容是网页的标题信息,它会显示在浏览器标签页的标题栏中。可以把它看成是一个网页的标题。主要用来告诉用户和搜索引擎这个网页的主要内容是什么,搜索引擎可以通过网页标题,迅速的判断出当前网页的主题。t

<!DOCTYPE HTML>
<html>
    <head>
        <title>蒂法</title>
    </head>
    <body></body>
</html>

网站开发html_网页基础代码大全

 

 

meta标签


Meta标签介绍:


元素可提供有关页面的原信息(mata-information),针对搜索引擎和更新频度的描述和关键词。


标签位于文档的头部,不包含任何内容。


提供的信息是用户不可见的。 meta标签的组成:meta标签共有两个属性,它们分别是http-equiv属性和name属性,不同的属性又有不同的参数值,这些不同的参数值就实现了不同的网页功能。


常用的meta标签:


  1. http-equiv属性

它用来向浏览器传达一些有用的信息,帮助浏览器正确地显示网页内容,与之对应的属性值为content,content中的内容其实就是各个参数的变量值。

 

<!--重定向 2秒后跳转到对应的网址,注意分号-->
<meta http-equiv="refresh" content="2;URL=http://www.baidu.com">
<!--指定文档的内容类型和编码类型 -->
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<!--告诉IE浏览器以最高级模式渲染当前网页-->
<meta http-equiv="x-ua-compatible" content="IE=edge">

  1. name属性

主要用于页面的关键字和描述,是写给搜索引擎看的,关键字可以有多个用 ‘,’号隔开,与之对应的属性值为content,content中的内容主要是便于搜索引擎机器人查找信息和分类信息用的。

 

<meta name="keywords" content="meta总结,html meta,meta属性,meta跳转">
<meta name="description" content="拉拉">

其他标签

<!--标题-->
<title>路飞学城</title>
<!--icon图标(网站的图标)-->
<link rel="icon" href="fav.ico">
<!--定义内部样式表-->
<style></style>
<!--引入外部样式表文件-->
<link rel="stylesheet" href="mystyle.css">
<!--定义JavaScript代码或引入JavaScript文件-->
<script src="myscript.js"></script>

 

 

 

testHTML

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <!--指定文档的内容类型和编码类型 -->
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
    <!--重定向 2秒后跳转到对应的网址,注意分号-->
    <!--<meta http-equiv="refresh" content="2;URL=http://www.baidu.com">-->

    <!--标题-->
    <title>蒂法</title>
    <!--icon图标(网站的图标)-->
    <link rel="icon" href="juhua.png">
</head>
<body>
<h1>海燕</h1>
        <p>在苍茫的大海上,</p>
        <p>狂风卷集着乌云。</p>
        <p>在乌云和大海之间,</p>
        <p>海燕像黑色的闪电,</p>
        <p>在高傲地飞翔。</p>
        <h1>一级标题</h1>
        <h2>二级标题</h2>
        <h3>三级标题</h3>
        <h4>四级标题</h4>
        <h5>五级标题</h5>
        <h6>六级标题</h6>
    <!--定义JavaScript代码或引入JavaScript文件-->
    <script src="myscript.js"></script>
    </body>
</body>
</html>

 





版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/167454.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 直和和直积_什么是直积举个例子

    直和和直积_什么是直积举个例子今天又在文章中看到直和和直积的概念,顺手baidu了一下,粘贴下来,其实以前矩阵论有讲过的。。。还是到用的时候印象最深。![在这里插入图片描述](https://img-blog.csdnimg.cn/20200609171605249.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80ODA5NDczMg==,size_…

    2025年6月14日
    2
  • noip2013普及组复赛答案_noip2020初赛

    noip2013普及组复赛答案_noip2020初赛Prob.1转圈游戏找到循环节,然后快速幂。代码:#include<cstdio>#include<cstring>#include<iostream>usingnamespacestd;intpos[1000005],vis[1000000];intn,m,k,x,p,mod;intpow(…

    2025年7月27日
    2
  • stm32f103c6t6引脚图_74ls163引脚图及功能表

    stm32f103c6t6引脚图_74ls163引脚图及功能表今天准备画一个STM32F103C8T6的最小系统板,就去STM32F103C8的数据手册查看了一下相应的引脚,因为数据手册里面的引脚表有中容量的多种封装描述,看上去比较麻烦,我就单独做了一个LQFP48脚的引脚表。方便后期自己画封装,就图看的省力一点哈。其部分图片如下所示:有需要的朋友可以从我的资源里去下,资源链接:STM32F103C8T6详细引脚表本人水平有限,上述信息仅供学习参考,如有错误和不妥之处,请多多指教。另外创作不易,请勿抄袭,如果有帮助到大家的话希望大家可以点个赞,谢谢~…

    2022年9月25日
    5
  • 深入理解MySQL索引设计和优化原则[通俗易懂]

    深入理解MySQL索引设计和优化原则[通俗易懂]索引类型探讨索引设计和优化原则之前,先给大家熟悉一下索引类型:主键索引PRIMARYKEY:它是一种特殊的唯一索引,不允许有空值。一般是在建表的时候同时创建主键索引。唯一索引UNIQUE:唯一索引列的值必须唯一,但允许有空值。如果是组合索引,则列值的组合必须唯一。创建命令:ALTERTABLEtable_nameADDUNIQUE(column);普通索引INDEX:最基本的索引,它没有任何限制。创建命令:ALTERTABLEtable_nameADDINDEXi..

    2022年6月24日
    24
  • JdbcTemplate使用总结建议收藏

    SpringJdbcTemplate在数据库的操作中,每个业务方法都要得到连接,开启事务,提交事务,回滚,关闭连接等,我们可以把这些做成一个模版,这样,在业务代码中只需要关注业务逻辑即可。MyJdb

    2021年12月20日
    40
  • hadoop生态圈的理解「建议收藏」

    hadoop生态圈的理解「建议收藏」 hadoop部分:hadoop生态圈的理解(HDFS,MapReduce,HBASE,zookeeper,hive,sqoop,flume,kafka,yarn,spark) 一、简介&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&am

    2022年5月22日
    25

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号