zoukankan      html  css  js  c++  java
  • 前端入门之——html day1

    具备三个要素的项目,就是web项目

    1、浏览器

    --向服务器阿奇请求,下载服务器中的网页(HTML),然后执行HTML显示出的内容。

    2、服务器

    --接收浏览器的请求,发送相应的页面到浏览器。

    3、HTTP协议

    --浏览器与服务器的通讯协议

    XML 和 HTML 

    可扩展标签语言

    标签,属性,标签的嵌套关系都可以扩展

    扩展,自定义

    超文本标签语言

    语法是固定的 w3c

    用来显示数据

    有一些特定的版本严格遵守XML规范

    可以将HTML理解为标签固定的XML

    超文本标记语言(英语:HyperText Markup Language,简称:HTML)是一种用于创建网页的标准标记语言。

    第一个网页:

     1 <!DOCTYPE html>
     2 <html>
     3     <!--
     4         在head 标签中对网页做一些基本的配置
     5     -->
     6     <head>
     7         <!--
     8             描述:在meta中 charset设置解码utf-8
     9         -->
    10         <meta charset="utf-8" />
    11         <title></title>
    12     </head>
    13     <!--
    14         描述:在body里面写网页具体的内容
    15     -->
    16     <body>
    17         你好,世界!
    18     </body>
    19 </html>

    实例解析

    • <!DOCTYPE html> 声明为 HTML5 文档
    • <html> 元素是 HTML 页面的根元素
    • <head> 元素包含了文档的元(meta)数据
    • <title> 元素描述了文档的标题
    • <body> 元素包含了可见的页面内容
    •  <标签>内容</标签> 

    HTML 网页结构

    HTML版本

    从初期的网络诞生后,已经出现了许多HTML版本:

    版本发布时间
    HTML 1991
    HTML+ 1993
    HTML 2.0 1995
    HTML 3.2 1997
    HTML 4.01 1999
    XHTML 1.0 2000
    HTML5 2012
    XHTML5 2013

    以X开头的版本是严格遵守w3c语法。不建议使用。

    <!DOCTYPE> 声明

    <!DOCTYPE>声明有助于浏览器中正确显示网页。

    网络上有很多不同的文件,如果能够正确声明HTML的版本,浏览器就能正确显示网页内容。

    doctype 声明是不区分大小写的,以下方式均可:

    <!DOCTYPE html> 
    
    <!DOCTYPE HTML> 
    
    <!doctype html> 
    
    <!Doctype Html>

    通用声明

    HTML5

    <!DOCTYPE html>

    HTML 4.01

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">

    XHTML 1.0

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    中文编码

    目前在大部分浏览器中,直接输出中文会出现中文乱码的情况,这时候我们就需要在头部将字符声明为 UTF-8。

    <head>
            <!--
                描述:在meta中 charset设置解码utf-8  声明网页的编码
            -->
            <meta charset="utf-8" />
            <title></title>
    </head>

    示例

     1 <!DOCTYPE html>
     2 <!--
     3 声明使用的HTML版本
     4 html 是唯一的根元素
     5 -->
     6 <html>
     7     <!--
     8         在head 标签中对网页做一些基本的配置
     9     -->
    10     <head>
    11         <!--
    12             描述:在meta中 charset设置解码utf-8
    13         -->
    14         <meta charset="utf-8" />
    15         <!--
    16             在title中 声明网页的标题
    17         -->
    18         <title>第一个网页</title>
    19     </head>
    20     <!--
    21         描述:在body里面写网页具体的内容
    22     -->
    23     <body>
    24         你好,世界!
    25         good html
    26     </body>
    27 </html>

    HTML 标题

    HTML 标题(Heading)是通过<h1> - <h6> 标签来定义的.

    HTML 段落

    HTML 段落是通过标签 <p> 来定义的.

    HTML 链接

    HTML 链接是通过标签 <a> 来定义的.

    <a href="http://www.runoob.com">这是一个链接</a>

    HTML 图像

    HTML 图像是通过标签 <img> 来定义的.

    示例:

     1 <!DOCTYPE html>
     2 <html>
     3     <head>
     4         <meta charset="UTF-8">
     5         <title></title>
     6     </head>
     7     <body>
     8         <!-- 标题    -->
     9         <h1>道君</h1>
    10         <h2>剑动山河</h2>
    11         <h3>魔天记</h3>
    12         <h4>辰南</h4>
    13         <h5>莽荒纪</h5>
    14         <h6>红楼梦</h6>
    15         
    16         <!-- 段落  -->
    17         
    18         <p>此时的清塞军身处吞云岭,四面尽是山歌</p>
    19         <p>此时的清塞军身处吞云岭,</p><p>四面尽是山歌</p>
    20         
    21         <a href="http://www.runoob.com">这是一个链接</a>
    22         <img src="http://p0.so.qhimgs1.com/t016997d986a16ebe7a.jpg" width="258" height="39" />
    23     
    24     </body>
    25 </html>
  • 相关阅读:
    使用CAShapeLayer做出圆形的进度条 —— #DF!
    NSDate分类,把系统返回的时间与现在进行比较---秀清
    NSPredicate类,指定过滤器的条件---董鑫
    UITextFIeld的输入格式问题 ----W.P
    AttributeText创建多彩文字Label --- hl
    自定义简单动画
    Swift 学习网址精选 By HL
    【C++服务端技术】移动广播
    【C++服务端技术】定时器
    【面试攻略】C++面试-4399
  • 原文地址:https://www.cnblogs.com/Mengchangxin/p/9240121.html
Copyright © 2011-2022 走看看