---很...">
美文网首页
html专题总结

html专题总结

作者: love2013 | 来源:发表于2016-08-01 20:02 被阅读20次

    <!doctype>告诉浏览器怎么解析文档--位置是首行

    <head>

    <meta charset="utf--8"/>---很重要自己上次面试写错了charsetcharsetcharset

    <title></title>

    <meta name='keyword"/>

    <meta name='viewport' content='width=device-width'/>

    </head>

    head的部分会再搜索引擎中能看到标题,关键字等

    html的标签

    语法:

    <>

    闭合

    一个标签可以带一个或多个属性直

    可以嵌套

    书写规范:

    小写

    属性值要引号

    常用属性

    id--在页面中只能出现一次

    class

    style

    title

    注释是用户不能看见的

    <form></form>

    标签的分类:

    根元素:html,head,title,meta,base,link,no script,style,script

    文本级别语义

    span,a,don,em,i,small,ins,s,time,b,strong,del,sub,sup,q,ruby

    a用途是<a></a>

    1.创建指向另一个文档的链接

    <a href="www.biadu.com" target='_self'>百度</a>

    target有四个:_self,_blank,inner和fame 中name一样

    2创建一个文档内部的喵点

    <a href='#pay"></a>

    <div id='pay'></div>

    3链接到email地址

    <a href='maito:yixin">邮箱地址是多个

    <a href='13333333"></a>

    组合内容

    div,没有任何语义是其他的元素的容器

    pre,dl,dt,dd,figure,figuration,ol,li,ul,p文字,新闻相关的

    列表

    有序列表可以嵌套

    排行榜之类用

    <ol type=‘a' start='2'><li></li></ol>

    无序列表

    <ul><li></li></ul>

    自定义列表

    <dl>

    <dt>作者</dt>默认有一定缩进

    <dd>描述dt</dd>

    </dl>

    pre格式化

    block quote长引用

    文档章节

    body,h1,aside,nav,section,footer,header,group,address

    交互元素

    menu,command,summary,detail

    表格数据

    col,colgroup,caption,table,tr,td,th,body,ahead,foot!

    <table

    <caption>标题</caption>

    <thead>头部

    <tr>每一行<th>表头用</th></tr>

    </thead>

    <tbody>

    <tr><th></th><td>普通的表格</td></tr>

    </tbody>

    <tfoot>

    <tr><td colspan='3'>跨列</td></tr>

    rowspan--跨行

    </tfoot>

    表单:服务端交互

    form,input,field set,select,option,fatalist,legend,output,texture,button,progress,label,keygen

    <form action='接口“  method='post'>

    <fieldset>内容分区

    <legend></legend>内容的标题

    <label for='file'></label>是提示信息

    《input type=‘file’/ name是提交给后端 placeholder》

    opt group分组 属性是label

    <buttton></button>

    </fieldset>

    input type

    -email

    -url

    -number

    -tel

    -search

    -range

    -color

    -date

    -mouse

    -day

    嵌入式内容

    img,area,map,embed,object,param,source,iframe,canvas,track,audio,video

    《img src='' alt='' tile=''/>

    <ifame src=''></ifame>切入页面广告之类

    <video loop autoplay  controls poster='封面‘> <source src><track kind='subtitles ' src='video.srt' label='english'>

    </video>

    canvas 利用脚本绘制图形

    svg-

    热点资源:

    map

    <img src='http:www.baidu.com' alt='yudong' width='100' height=''dd' usemap='#map"/>

    <map name='map' data-ganmane='422'' data=gapoint=''dian'>

    <area shape='rect' coords='',href='' ,target=_blank>

    </map>

    强调

    em语义上强调,strong是粗体

    换行br

    文本

    引用cite,q文字

    <div>鲁迅在<cite>故乡</cite>中写道<q>地上本来没有路,走的人多了便有了路</q>

    </div>

    code代码

    《code》《/code》

    格式化

    b粗体,i技术俗语

    <b>标记</b>

    什么是语义化?

    用正确的标签描述页面

    作用:seo

    可访问性

    可读性

    实体字符--转义字符

    &nbsp空格

    ‘&quot;

    >&gt;

    <&lt

    @&copy

    &-&amp

    相关文章

      网友评论

          本文标题:html专题总结

          本文链接:https://www.haomeiwen.com/subject/udxfsttx.html