HTML

1.html基础
  (1)什么是html?
     hypertext markup language,超文本标记语言。
     用于开发网页的语言,由浏览器解释执行。(W3C tim berners lee创立的 web之父html也是他发明的,我们要纪念一下,要怀着感恩的心去理解他的发明。)
     html文件以.html/.htm结尾。(8.3早期window点号后面只能有三个字符,所以只能用htm)
     
  (2)html的文件的基本结构
   <html>
        <head>
           <title>标题</title>
           <!--用于模拟服务器http消息头-->
           <!--比如以下消息头的作用,是
           告诉浏览器,返回的是一个html并且
           应该以gb2312的编码来显示该页面
           ,html文件保存的编码应该与meta
           声明的编码一致-->
           <meta http-equiv="content-type"
           contnet="text/html;charset=gb2312">
           <!--引入脚本js-->
           <script>干嘛的!以后再说
           <!--定义样式-->
           <style>
           <!--引入外部样式-->
           <link>
        </head>
        <body>
           <!--页面显示数据-->
        </body>
      </html>  
        
 
 (3)web开发标准
       w3c (www.w3cschool.com)
       建议开发一个页面,应该这样子设计:
       页面的结构(包括了数据),由html文档来负责
       页面的外观,由css文档来负责。
       页面的行为,由javascript文档来负责。
      
 (4)列表
       a.无序列表
       b.有序列表
       c.列表嵌套
      
      
 (5).其它标记
             <h1>...<h6>:标题
             行内标记:
               不单独占一行的标记
               <span></span>
               <strong>加粗</strong>
             块级标记:
               另起一行的标记
               <h1>.....<h6>
               <p>
               <div>(用来布局)
              
 (6)html/xhtml
              xhtml:扩展的超文本标记语言。
              w3c按照xml语法要求重新定义了html中的标记与相应的属性。
              比如:1.标签必须层层嵌套
                     2.属性必须用""引起来
                     3.标签必须要有结束标签
                     4.尽量使用小写。
                     <font size=red>:error!
                     <font size="red">:ok!          
                     <br>:error!
                     <br/>:ok!   
                  
                   html/xhtml文档类型声明 (加上好但是不加也无所谓)
                   xhtml过渡型
                   xhtml严格型
                   html严格型
                   html松散型(一般就加这个)

2.

链接

   基本语法 

     <a href="链接打开的位置" target="链接内容在哪里打开">描述文字或者加图片</a>

       target=链接内容在哪里打开   _blank:在新的窗口打开    _self:在当前窗口打开
         如果不设置target属性,默认值为_self

  锚链接、锚点
        命名一个锚点
        <a name="top"></a>
        跳转到锚点
        本页面跳转到锚点
        <a href="#top">to top</a>
        从另一个页面跳转到当前页面的锚点
        <a href="h.html#top">to top</a>

  功能链接
        发送邮件!
        <a href="mailto:电子邮箱">[联系我们]</a>

特殊符号
  在页面中年,如果有空格出现(&nbsp;)引号(&quot;) >(&gt;) <(&lt;) @(&copy;)要使用相应的实体来代替,主要目的是避免浏览器的解析出错
   

  两个空格相当于一个汉字
  一个空格相当于一个英文字母
 

表单
  表单基本结构
  <form action="abc.do"method="">
  input标记
  非input标记
  </form>

  <input name="表单元素名称" type="类型" value="值" size="显示宽度"  maxlength="对大长度" checked="是否选中" />

  action属性:表单提交的内容由哪个程序来处理
  method属性:表单提交的方法

  input标签
    input type="text"/"password"/"button"/"checkbox"/"radio"/"hidden"/"file"/"reset"/"submit"

  非input标签

  select既可以用于下拉菜单,也可以用于多选框(multiple) textarea  button  img

列表

  无序列表

    <ul>

      <li>内容填充在列表项里</li>

    </ul>
    

  有序列表
  <ol>
    <li>内容填充在列表项里</li>
  </ol>
 
  列表的嵌套

 

框架

  什么是框架
    将一个窗口划分为多个子窗口,每一个子窗口可以放置一个页面。
   
    frameset:
    iframe:
    frameset页面中不能出现body,而iframe可以用在body标签里

 

3.

块级元素可以分为以下几类:块级元素按照其应用于结构还是内容分为三种:结构化块状元素,终端块状元素,多目标块状元素。

  一.结构化块状元素

  这类元素用于构造文档的结构,一个好的文档结构对于搜索引擎和应用其他技术(如JavaScript)都是十分有利的。它们没有语义上的含义,仅仅划分出了文档的组织方式,并    没有体现文档的内容。

  主要的结构化块状元素

  <ol> <ul> <dl> <table>

  支持结构化的元素

  <li> <dt> <dd> <caption> <thead> <tbody> <tfoot> <colgroup> <col>

  二.终端块状元素

  这类元素用于从结构转向内容,它们拥有语义上的含义,能够表明内容的性质。终端块状元素属于结构的终点,它们不能再包含其他块级元素,只能包含文本或行级元素。

  终端块状元素

  <h1>...<h6> <p> <blockquote> <dt> <address> <caption>

  三.多目标块状元素

  所谓多目标指的是可以自由的扩展或嵌套文档的结构,以可以终端的形式出现。当多目标块状元素以结构化的方式使用时就含有结构化的内涵,以终端的形式使用就含有语义的内涵。

  多目标块状元素既可以包含块状元素,也可以包含内容(文本与行级元素的组合为内容),但不能同时包含两者。应该把内容放在块状元素中。块状元素不应作为行级元素与文本的兄弟元素,受HTML校验器的限制,目前还没办法检验出此种情况,但是应该避免。

  多目标块状元素

  <div> <li> <dd> <td> <form> <noscript>

  从这里可要看到,HTML提供了7种元素——<div>、<li>、<dd>、<td>、<th>、<form>和<noscript>——来扩展或终止结构。所以,我把它们叫做多目标块状元素,因为它们是最多才多艺的元素。可以用它们来确定文档分区、列表项、词典释义、表格数据单元格、表格头部单元格、表单和当脚本无法运行时的可替换内容。

  当多目标块状元素以结构化的方式使用时,它就拥有结构化的内涵。当以终端的方式使用它,它就拥有语义化的内涵。例如,当一个列表项作为终端的时候,其中的内容就成为某个列表中的一项。当列表项包含了一个结构化块状元素(例如表格或另一个列表)时,它从结构上就作为一个大的嵌套结构中的小节点起作用。

  多目标块状元素既可以包含块状元素也可以包含内容,但是不能同时包含两种。文本与内联元素(图片、对象、控制元素和语义化的标记)的组合才构成了内容。块状元素不应该作为内联元素和文本的兄弟元素。我们把它称之为混合内容(mixed content)。应当把内容放在块状元素中——而不是放在它们之间。因为HTML文档类型定义语言中的限制,HTML校验器时常不能检测出拥有混合内容的文档,但是这不意味着就可以让此种情况出现。当浏览器遇到混合内容的时候,它会给内容套上一个匿名容器。这是因为当块状元素是按顺序排列的,而其中又穿插内容的时候,浏览器不能同时解析块状元素和内容。CSS选择符不能选择匿名块状元素,它会阻止你对其赋予样式。在使用这七类多目标块状元素的时候可以考虑经下细节:

  <div>是一个分区。它通常是结构化的,但是它也能含有内容。如例子中所示,由分区创建的块状结构是不可见的,除非为每个分区赋予外边距、边框和/或内边距。

  <li>是一个列表项。一般来说,它是一个包含内容的终端块状元素,不过它也能包含结构化块状元素(比如表格和列表)或终端块状元素(比如标题和段落)。

  <dd>是定义列表中的一个定义。通常它是作为一个可包含内容的终端块状元素,但是它也可以含有结构化或终端的块状元素。

  <td>和<th>是表格单元格。<td>是数据单元格,<th>是标题单元格。通常单元格是包含内容的终端块状元素,但是它们也可以包含结构化或终端的块状元素。

  <form>是输入数据的表单。它可以含有结构化的块状元素,用于组织表单控制元素(如例中所示),或者直接包含内联表单控制元素(如“HTML结构”的那个例子所示)。它也能够包含终端元素(例如标题和段落)。

  当浏览器不支持脚本的时候,就会显示<noscript>。它可以包含简单的内联内容或者拥有完整结构的文档。

 

xhtml和html的区别
     xhtml:可扩展的文本标记语言
     html:是一种松散的语言,大小写不敏感。
    
     html有文档声明
     第一行,写文档类型声明(可以省略)

  XHTML 过渡型
  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  XHTML 严格型
  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
   HTML严格型
  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
  HTML松散型
  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
   
  html书写规范
    (1)标记有开始,也有结束,对于单个标签<br/><hr/>
    (2)标记层层嵌套,并且嵌套要正确
    (3)全部用小写
    (4)属性值要用双引号引起来
    如:width="200px"

郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。