自己刚学html的时候记得笔记,别嫌丑,我就是这么学过来的

杂谈 专栏收录该内容
22 篇文章 2 订阅
盒子的阴影
box-shadow:0px 0px 0px #000000;分别是宽高阴影密度颜色
box-sizing:border-box;padding包括里面
            content-box;padding不包括里面
块级元素和内链元素的转换
display:block;转换为块级元素盒子元素
inline转换为内链元素  block-line都有
html介绍
   超文本标记语言,即html(hypertext markup language),是用于描述网页文档的一种标记语言。html之所以称为超文本标记语言,是因为文本中包含了所谓“超级链接”点。所谓超级链接,就是一种url指针,通过激活(点击)它,可使浏览器方便地获取新的网页。这也是html获得广泛应用的最重要的原因之一。
xhtml介绍
    xhtml是the extensible hypertext markup language(可扩展超文本标记语言)的缩写。xhtml是一个基于xml的标记语言,看起来与html有些相像,只有一些小的但重要的区别,xhtml就是一个扮演着类似html的角色的xml,所以,本质上说,xhtml是一个过渡技术,结合了部分xml的强大功能及大多数html的简单特性。
w3c简介
   万维网联盟是国际著名的标准化组织。
1994年成立后,至今已发布近百项相关万维网的标准,对万维网发展做出了杰出的贡献。目前,万维网联盟拥有来自全世界40个国家的400多个会员组织,已在全世界16个地区设立了办事处。2006年4月28日,万维网联盟在中国内地设立首个办事处。(深圳北京航空航天大学)
w3c中国
中国企业w3c联盟成员汇总
    2011年9月15日消息,百度(纳斯达克证券代码:BIDU)已经加入万维网联盟,并成为该联盟中的第一家中国公司。
    百度在加入万维网联盟之后,将能够与全球500加IT和互联网企业联手,共同研究和制定互联网开放平台及无线互联网技术等相关的国际互联网网络标准。腾讯和360也后续加入
编辑html
    html其实是文本,它需要浏览器的解析,html的编辑方式大体可以分为两种:   手工编写方式:使用记事本等编辑器,将文件存成.htm或.html格式即可。
    使用可视化编辑器:如Dreamweaver、frontpage等。
提示:关于.html和.htm,其实两者之间没有本质意义的区别,htm只是为了满足DOS仅能识别8+3的文件名的格式而已,在DOS下文件名的命名规则只能是文件名8位长度,文件后缀3位长度这样的规则。
xhtml标签
    xhtml语法非常简单,组成xhtml的元素只有xhtml标签与xhtml属性。
            在xhtml中标记被分成两种:
      1、双标签
          <标签名 属性=“属性值” 属性=“属性值”>内容</标签名>
      2、单标签
          <标签名 属性=“属性值” 属性=“属性值”/>
xhtml语法规范
1、在xhtml中标记名称必须小写
2、在xhtml中属性名称必须小写
3、在xhtml中标签必须严格嵌套
4、在xhtml中标签必须封闭
5、在xhtml中,即使是空元素的标记也必须封闭
6、在xhtml中属性值用双引号括起来
7、在xhtml中属性值必须使用完整形式
8、在xhtml中,应该区分“内容标记”与“结构标记”
xhtml基本结构
     是以<html>标签开始以及</html>标签结束的,整个文档被分成头部(head部分)和体部(body部分)两部分。
<head></head>标签
  <head>标签用于定义文档的头部,他是所有头部元素的容器。<head>中的元素可以引用脚本、指示浏览器在哪里找到样式表、提供元信息等等。
   文档的头部描述了文档的各种属性和信息,包括文档的标题、在web中的位置以及和其他文档的关系等。绝大多数文档头部包含的数据都不会真正作为内容显示给读者。
下面这些标签可用在head部分:<base>,<link>,<meta>,<script>,<style>,以及<title>.
<title>定义文档的标题,它是head部分中唯一必须元素。
<meta />
<meta />元素可提供有关页面的元信息(meta-infotmation),比如针对搜索引擎和更新频度的描述和关键词。
<meta />标签位于文档的头部,不包含任何内容。<meta>标签的属性定义了与文档相关联的名称/值对。
    <meta http-equiv="content-type" content="text/html; charset=gb2312(或者utf-8、big5) />标准格式说明这是一个什么html,用的说明标准,必写
    <meta http-equiv="refresh" content="2;url=http://www.baidu.com" />
            意思两秒之后刷新到百度主页
    <meta name="author" content="作者“ />
 <meta />中title、keywords、description的限制
      <meta name="keywords" content="关键词1,关键词2,……” />
    <meta name="description" content="这里写网站的描述" />
 title内容设置的时候一般不超多80个字符,符号也算
keywords关键字设置的时候内容一般不要超过100个字符,关键字与关键字之间的字符一般用英文逗号隔开!!!关键词一般设置七个左右,不会被恶意屏蔽
description描述设置的时候内容一般不要超过200个字符,搜索引擎一般能显示40个字
<body></body>
body元素定义文档的主体
body元素包含文档的所有的内容(比如文本、超链接、图像、表格和列表等等。
常用的文本标签   标签                               用途
               <h1></h1>~<h6></h6>                标题用


               <p></p>                             段落用


                   <br />                          换行用


                 <pre></pre>                   预先格式化标签


                <i></i>、<b></b>、<u></u> 用于对文本应用各种格式,
                 <strong></strong>         如粗体,斜体,下划线
                 <em></em>、<sub></sub>      下标,上标等
                    <sup></sup>   
                
                   <font></font>              字体标签


                   <ul></ul>、<ol></ol>        列表用


                      <hr />                   水平线标签
   <h1-6></h1-6>标题标签
        <h1>-<h6>标签可定义标题。<h1>定义最大的标题。<h6>定义最小的标题。浏览器在解析标签的时候会自动地在标题的前后添加空行。一个网页只有一个标题。
     标题标签显示特性:
      1、标签中的文字默认加粗
      2、h1-h6文字大小逐渐变小
      3、标题标签默认独占一行
      4、标题标签默认上线文有间距
    <p></p>段落标签  定义段落
  p 元素会自动在其前后创建一些空白。浏览器会自动添加这些空间,您也可以在样式表中规定。
   标签默认显示特性:
       1、一个<p></p>标签默认独占一行。
       2、每个<p></p>标签和上下文直接都有一定间距。
     属性                    值           描述
                     left(居左)
     align           center(居中)      规定段落中文本的排列
                      right(居右)
    <pre></pre>预先格式化标签
  pre元素可定义预先格式化的文本。被包围在pre元素中的文本通常会保留空格和换行符。而文本也会呈现为等宽字体。
<pre>标签的一个常见应用就是用来表示计算机的源代码。
       字符格式化
  <i></i>用来标记文字斜体(过时)
<b></b>用来标记文字加粗 (过时)
<u></u>用来标记文字下划线
<strong></strong>用来标记文字加粗的标记
<em></em>用来标记文字斜体的标记
<sub></sub>用来标记文字下标显示
<sup></sup>用来标记文字上标显示
          <font></font>文字字体标签用来控制文字显示的样式。
  比如说字体、颜色、大小等。font标签中有一些属性需要我们去了解。color属性是用来控制文字颜色的。size是用来控制文字大小的。face属性用来控制字体
  <font color="颜色” size="字体大小" face="宋体,黑体,楷体" >内容</font>
       属性         值                               描述
     color         rgb(255,255,255)             规定文本的颜色
                   #FFFFFF
                    red,bule,yellow


      face         宋体,黑体,楷体                   规定文本的字体


      size           1-7,默认是3                     规定文本的大小


      <ul></ul>无序列表  <ol></ol>有序列表
    列表项用<li></li>标签
       <ul type="disc">   </ul>
    无序列表属性     描述             有序列表属性    描述
     disc      默认值,实心圆           1          默认值列表项文阿拉伯数字
     circle       空心圆                a           小写英文
     square       实心方块              A           大写英文
                                        i            小写罗马数字
                                        I           大写罗马数字
      <hr />水平线标签 在html中创建一条水平线
        水平分隔可以在视觉上将稳定分隔成各个部分


        属性名           属性值                      作用
       align         center,left,right       控制水平线的对其方式
      
       noshade         noshade                  控制hr预算显示颜色为纯色(把标签的颜色填充起来)


        size          多少px                    控制水平线的高度(厚度)


        width         px  百分比%               控制水平线的长度


     特殊字符
       &gt;                            大于号(>)
       &lt;                            小于号(<)
       &quot;                           引号(”)
       &reg;                            注册商标(带圈的R)
        &copy;                           版权符(带圈的C)
       &amp;                              &符号
       &nbsp;                            空格
    
        <a></a>超链接
     在xhtml中使用超级链接与网络上的另一个文档相连。几乎可以所有的网页中找到链接。点击链接可以从一张页面跳转到另一张页面。用来表示链接的标签为<a></a>
       <a href="http://www.baidu.com">百度</a>
       
        属性      值                            描述
        href      url                        链接的目标url
       
        target     _blank另一页 新的一页
                   _self 在本页 默认                    在何处打开目标url
                   _parent在父框架集中打开
                   _top在整个窗口中打开
                   framename   在指定的框架中打开
              href 属性 相对路径、绝对路径
       相对路径是相对于当前文档的位置找到目标文档的路径
             ./是当前路径 可以省略
            ../ 是上级路径
              反之则是绝对路径
       a标签除了创建普通的链接以外还能穿件邮件链接,当点击邮件链接是浏览器会打开客户端系统中默认的邮件客户端进行邮件的操作。穿件邮件链接的方式只要在href属性中写入“mailto:邮件地址”就可以了
       <a href="mailto:344871874@qq.com">344871874@qq.com</a>
 
       <img />图片标签
 在xhtml中如果要插入图片,我们就要用到img标签。img标签是个单标签。img标签中有几个常用的属性让我们来看下。
          <img src="1.jpg" width="100" height="100" />
        特殊字符                           效果
        src                    属性设置的是要插入图片的url地址


        alt                      alt属性用来为图像定义一串预备可替换的文本
                                     无法加载图片会显示文字
         width                    指定图像的宽度
        
         height                     指定图像的高度
     
         align="absmiddle";          图片上下居中         


       xhtml中的框架的处理
     使用xhtml中的款姐结构就可以吧一个浏览器窗口分割成几个小窗口,每个串口可以显示不同的网页,每个框架里的网页相互独立。不仅可以分成方便地在浏览器中同时浏览不同的网页,还可以非常方便地完成导航的工作。
     如果所有的框架标签都要放在xhtml的文档中,这个xhtml的文档的体部也就是<body></body>标签将被框架集标签<frameset></frameset>标签代替,然后通过<frame />标签定义每一个子窗体和子窗体的页面。子窗体的排列顺序为从左到右,从上到下的次序规则。


示例  <html>
       <head>
      <meta http-equiv="content-type" content="text/html;charset=utf-8" />
       <title>示例</title>
       </head>
       <frameset row="80,*">
           <frame src="top.html" name="topframe" />
           <frame src="main.html" name="mainframe" />
        </frameset>
        </html>


      属性                          说明
    cols        用像素或者百分比来分割左右窗口,*表示剩余部分
     rows      用像素或者百分比来分割上下窗口,*表示剩余部分
    frameborder     指定是否显示边框。0表示不显示,1表示显示
     border     指定款姐边框的粗细
     noresize   frame里面的标签 =“noresize”边框不可移动
 框架里的<a herf="网址” target=“top(指定网页在上面框里打开)left right bottom” />
      兼容性里面
       <noframes>
           <body>
              <h1>你的浏览器不支持框架</h1>
           </body>
        </noframes>
         显示里面内容则是浏览器不支持框架




        html中的表单
  表单是一个保护表单元素的区域。表单元素是允许用户在表单中添加如:文本域、下拉列表、单选框、复选框等中输入信息的元素。
 表单用<form></form>标签
        <form>标签用于为用户输入创建html表单。
      属性        值                           说明
     action      url           规定当提交表单是,向何处发送表单数据


     method    get/post         规定如何发送表单数据


      name       name           规定表单的名称


     enctype    mime_type       规定表单数据在发送到服务器之前应该如何编码
       默认可以不写,特殊情况需要写,比如需要上传头像什么的
      
      <form>标签有三个是我们经常用到的
      
       action属性        该属性是指定表单提交的地址
   
       method属性      该属性是指定表单提交的方式,它的方式有两种post和get
     
       enctype属性      规定在发送到服务器之前应该如何对表单数据进行编码。默认的,变动数据会编码为“application/x-www-form-urlencoded"。就是说,在发送到服务器之前,所有字符都会进行编码(空格转换为”+“号,特殊符号转换为 ASCII HEX值)。当为“multipart/form-data"属性时一般是用来做上传是传说文件用的。
        
        表单中的元素


  文本框
   <input type="text" name="name" value="默认值” maxlength="12" />
     value是框里面默认的内容 type和name是必写的 maxlegth最大长度 写用户名




  密码框
    <input type="password" name="name" />
 
  复选框
     <input type="checkbox" name="name" value="值" checked="checked" />
       注意名字不能相同 所有属性都需要写 value接收用 checked为默认选中


   单选框
    <input type="radio" name="name" value="值" checked="checked" />
    单选框的同一系列选项name必须一样,除checked以外必写


    提交按钮value内容显示在按钮上
    <input type="submit" name="name" value="提交" />


     重置按钮value内容显示在按钮上
    <input type="reset" name="name" value="重置" />
       放到哪里都会重置本页的内容


     上传框
     <input type="file" name="name" />


      隐藏域
    <input type="hidden" name="name" value="固定值" />
        一般是存储固定值的


     普通按钮
    <input type="button" name="name" value="按钮" />可以自定义事件
   
     多行的文本输入控件
      <textarea name="name" cols="8" rows="3">
          框里的默认值
          </textarea>
          cols代表宽度 rows代表高度 1代表一个字符


         下拉框
        <select name="name">
            <option value="1">选项1</option>
            <option value="2" selected="selected">选项2</option>
            <option value="3">选项3</option>
        </select>
          所有的表单元素必须有名字,selected为默认选中 value代表每一个选项所对应的值


         表格
   表格的最基本单位是单元格,然后是行或者列。最后才是表格本身。需要呈现的数据就必须写在单元格内,否则在某些浏览器中将不被显示。
     在xhtml中,表格是通过<table></table>、<tr></tr>、<td></td>标签来完成的。
      示例表格
   <table border="1">
         <tr>
             <th>标题</th>               
             <th>作者</th>    标题          作者        时间
             <th>时间</th>
          </tr>               这是一个表格   php100      2012.5.6
          <tr>
              <td>这是一个表格</td>
              <td>php100</td>
              <td>2012.5.6</td>
           </tr>
      </table>
       (th代表表格的标题只有一行,剩余的全是td,标题默认加粗居中)


         table的属性
        属性                           说明
      
       width           表格的宽度,可以用像素或者百分比表示
       height          表格的高度,可以用像素或者百分比表示
       align            表格在页面的水平对齐情况
       bgcolor          表格的背景颜色
       border            表格的边框粗细 像素大小,可以设置为0
       bordercolor        表格的边框颜色
       cellspacing        单元格之间的间距,0是正常的表格
       cellpadding        表格内内容与单元格之间的间距
     
         <tr></tr>标签定义html表格中的行


         属性                            说明


        align               行内内容的水平对齐情况
        valign  top Middle bottom            行内内容的垂直对齐情况
        bgcolor              行的背景颜色
        
        <td></td>标签html表格中的单元格
         
         属性                             说明
      
        width        单元格的宽度,可以用像素或者百分比表示,最宽的td决定了这一列的宽度。
         height      单元格的高度,可以用像素或者百分比表示
        align         单元格内内容的对齐情况
         bgcolor       单元格的背景颜色
         colspan    占几行               单元格横向合并
         rowspan    写数字几               单元格纵向合并 


      传统table布局 不利于设计和修改
   缺点  设计复杂,改版时工作量巨大
          表现代码与内容混合,可读性差
          不利于数据调用分析
          网页文件量大,浏览器解析速度慢如蜗牛


      web标准的构成
     结构:用来对网页中的信息进行整理与分类
         船用的技术有:html、xhtml、xml


      表现:用于对已经被结构化的信息进行显示上的修饰,包括板式颜色大小等
      主要技术就是css,目前版本3.0


      行为:是指对整个文档内部的一个模型进行定义及交互行为的编写
       主要技术有:JavaScript脚本语言


         div+css的好处
       
        1、高效率的开发与简单维护
            2、信息跨平台的可用性
         3、降低服务器成本,加快网页解析速度
           4更良好的用户体验
                   使网页的表现与内容分离
     <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">是表示默认的格式兼容性的网页表现与内容。


       在html中引入css的方法


     行内式
          <h1 style="color:white; background-color:blue">内容</h1>


     内嵌式
          <style type="text/css">
              h1{color:white; background-color:blue}
           </style>


      导入式
          <style type="text/css">
               @import"mystyle.css";
             </style>


       链接式
           <link href="mystyle.css" rel="stylesheet" type="text/css" />
                 表示这是引入了一个css样式的脚本,3个属性都不能省
         最多引入31个css


    css选择器
          选择器{ 属性:值; 属性:值; }
         标记选择器        html标记,标签名
         类别选择器         .classname
         id选择器           #idclassname
           *或者body          页面里面所有的标签
     在一个页面,class可以给很多,id具有唯一性


       复合选择器
          交集选择器
                div.a{ 属性:值; }
                div#ad{ 属性:值;}
          并集选择器
                div,h1.first,p.specia{ 属性:值; }
          后代选择器
                div h1.first span.firstletter{ 属性:值; }
         
          css优先级
            行内样式>id样式>类别样式>标记样式
       
          css文字样式
           准备网页
         设置字体
            文字大小
           行高
             文字颜色与背景颜色
             文字加粗、倾斜与大小写
            文字的装饰效果
             文字的水平对齐方式
              文字布局
              段落的垂直对齐方式
 
         css文本处理


文本缩进:text-indent:px % cm 如果值是负数 则向左-9999则是隐藏


文本对齐:text-align:left right center justify(两端)


色   彩:color:#FFFFFF red rgb(0,0,225)


字   体:font-family: atial "黑体","宋体"


字体大小:font-size:可以是单位尺寸,也可以用绝对字体尺寸或相对字体尺寸


字体粗细:font-weight:normal bold(最细100~700最粗) bolder比normal粗 lighter比normal细


文字修饰:text-decoration:underline(下划线)line-through(横穿线)overline(上划线)none(没有修饰)


大小写:text-transform:capitalize(首字母)upperease(大)lowerease(小)


行高:line-height 单行文本高度 可以调节上下位置
      
示例p{text-indent:10px; text-align:center; color:blue; font-size:100px;
            font-weight:500; text-decoration:underline; 
            text-transform:capitalize; line-height:10px;}
              
            css背景的处理
背景固定:background-attachment scroll背景随对象滚动(默认) fixed 背景固定


背景颜色:background-color


背景图像:background-image:url(./images/1.jpg)


背景定位:background-position top center bottom left right Middle x y(对一张图片进行背景定位)


背景重复:background-repeat no-repeat repeat-x repeat-y


背景透明:background:rgba(0,0,0,0.5)


背景透明别的颜色:filter:alpha(opacity=50);  -moz-opacity:0.5; -khtml-opacity: 0.5;opacity: 0.5


背景:background:url(./images/1.jpg) #990000 repeat-x 100px 50px;
   


           盒子模型
    从外到内分别是margin border padding content
写的盒子的宽度和高度都是border的宽度和高度
盒子在网页上所占的多少是有四项一块算的


 margin/padding的简写
  方法是按照规定的顺序,给出2个、3个、或者4个属性值,它们的含义将有所区别,具体含义如下:


 如果给出2个属性值,前者表示上下边框的属性,后者表示左右边框的属性


 如果给出3个属性值,前者表示上边框的属性,中间数值表示左右边框的属性,后者表示下边框的属性;


如果给出4个属性值,依次表示上、右、下、左边框的属性,即为顺时针排序。


            margin:5px(上下) 10px(左右);
      margin:5px(上) 10px(左右) 15px(下);
   margin:10px(上) 8px(右) 5px(下) 15px(左)


     深入盒子 边框-border
属性
 颜色 border-color:red;
 宽度border-width:1px;
 样式border-style:dotted(点划线) dashed(虚线) solid(实线) double(双重线)下面只有一根线 border-bottom
简写
         border:1px solid #FF0000;


                  块级元素和内联元素
块的显示与继承


          display:block(块) none(隐藏) inline(内联)


         块与内联的区别


        块的对象默认宽度是100%(继承自父元素),如果没有采用”float:left/right;"样式,相邻的两个块对象就会分排在不同的两行上。
       内联对象的快读取决于其内部元素的宽度与padding样式值之和,不可直接指定其宽度与高度("display:block;" "float:left/right;"强行转换之后可以定义),相邻的两个内联对象会排在同一行上。(内联元素不可以设置高度和宽度,但可以使用border,margin和padding)
    h1默认有margin p标签也是有margin


            深入理解盒子模型
      div标记与span标记       div:块级元素(block) span行内元素(Iinline)
               float:浮动 left right           clear 清除浮动  left  right  both(左右一块清除)
      浮动会排成一排,如果想排在浮动的下面,可以给下面的盒子属性添加clear清除浮动的影响


             css伪类(链接的样式)
       :link    :hover :active  :visited


         属性                                   说明
        a:link             超链接的普通样式,即正常浏览状态的样式
        a:visited          被点击过后的超链接的样式
        a:hover              鼠标指针经过超链接上时的样式
        a:active             在超链接上单击时,即“当前激活”时,超链接的样式,点住时的样式


                        css定位
         position:ststic(默认) absolute  relative   fixed(ie6不兼容)
   ststic 没有特别设置 对z-index无效
   absolute 使用left,right,top,bottom等属性相对于最接近的一个最有定位设置的父对象进行绝对定位
   relative使用left,right,top,bottom父对象进行相对定位
    z-index设置块与块之间的层级关系的,z-index:-9999~9999;数值越大,越在上面,最好写正数。
                    
                       css列表样式
   属性                       值
   list-style-type        disc       默认值,实心圆
                        circle           空心圆
                         square       实心方块     
                          none         不使用项目符号
         (有序列表项ol) decimal        阿拉伯数字
                         lower-roman    小写罗马数字
                         upper-roman     大写罗马数字
                         lower-alpha     小写英文字母
                         upper-alpha     大写英文字母
   list-style-image:url(./1.jpg);(把前面的符号改成图片)
    list-style-position:outside(标记在文本外) inside(标记在内)(标记在border内外的意思)


                        css溢出         overflow
                            
           overflow:       hidden     隐藏
                            scroll     滚动条
                            auto       自动设置是否需要滚动条
                            visible    默认
           overflow-x:       
           overflow-y:        单向设置一个方向的
           
                        css兼容及处理


1、<!--[if !ie]><!-->除ie外都可识别<!--<![endif]-->(IE11也可以识别)


2、<!--[if ie]>所有的ie可识别<![endif]-->


3、<!--[if ie6]>仅ie6可识别<![endif]-->


4、<!--[if gte ie6]>ie6以及ie6以上版本可识别<![endif]-->


5、<!--[if ie7]>仅ie7可识别<![endif]-->


6、<!--[if gte ie7]>ie7以及ie7以上版本可识别<![endif]-->


7、<!--[if it ie7]>ie7以及ie7以下版本可识别<![endif]-->


ie兼容处理工具   ietester     作用;模拟ie的一些版本  网址:www.ietester.com   里面有个debugbar  可以直接查看 临时调整属性
 
     浏览器 查看元素           火狐 firebug  调整兼容    ie工具里面有一个 开发人员工具


               css兼容二
   !important 优先级显示        ie6不支持    width:100px !important;


   *html .a{    }         ie6 ie7 ie8支持
   *+html .a {    }    ie7 支持  也不管用
    .a{_background-color:red;}    ie6支持
    
      ie8兼容    <meta http-equiv"x-ua-compatible" content="ie=7" />意思ie8以上的浏览器暂时以ie7版本运行,固定用法,不可更改
                                                        7可以往上加,不可以往下加


   网站内容命名
     顶部  top      导航栏nav   广告栏 adv       底部footer  搜索search
  首页叫index.html      产品页  category。html      产品详细页deltails.html


   special.html


                      html 5


新增元素
1<section></section> 内容区块与 h1等元素结合使用 标示文档结构


2<article></article>一块上下不相关的独立内容,比如一篇文章
 <aside></aside>表示areticle元素内容之外的、与areticle内容相关的辅助信息


<header></header>表示页面中一个内容区块或整个页面的标题


<hgroup></hgroup>元素用于对整个页面或页面中一个内容区块的标题进行组合


<footer></footer>表示整个页面或页面中一个内容区块的脚注,包含作者的姓名创作日期以及作者联系信息


<nav></nav>表示页面的导航链接部分


<figure>
<figcaption>标题</figcaption>
<p>这里写内容</p>
</figure>
表示一段独立的流内容,一般表示文档主体内容中的一个独立单元,使用figcaption元素为figure元素组添加标题


<video src="movie.ogg" controls="controls">video元素</video>
定义视频


<audio src="someaudio.wav">audio元素</audio>
定义音频 比如音乐或音频流


<embed src="horse.wav" />
插入多媒体,格式可以是midi,wav,aiff,au,mp3等


<mark></mark>元素主要用来在视觉上向用户呈现那些需要突出显示或高亮显示的文字。
<meter></meter>用来显示javascript中耗费时间的函数的进程


<time></time>表示日期或时间


<canvas id="mycanvas" width="200" height="200"></canvas>
表示图形,比如图表和其他图像。这个元素本身没有行为,仅提供一块画布,单它把一个绘图api展现给客户端javascript,以使脚本能够把想绘制的东西绘制到这块画布上


<command οnclick="cut()" label="cut">
表示命令按钮,比如单选按钮 复选框或按钮

  • 3
    点赞
  • 0
    评论
  • 3
    收藏
  • 打赏
    打赏
  • 扫一扫,分享海报

参与评论 您还未登录,请先 登录 后发表或查看评论
©️2022 CSDN 皮肤主题:技术黑板 设计师:CSDN官方博客 返回首页

打赏作者

暮志未晚Webgl

你的鼓励将是我创作的最大动力

¥2 ¥4 ¥6 ¥10 ¥20
输入1-500的整数
余额支付 (余额:-- )
扫码支付
扫码支付:¥2
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值