zoukankan      html  css  js  c++  java
  • MOOC web前端开发笔记(二)

    HTML

    HTML概述

    HTML(HyperText MarkUp Language)
    "超文本标记语言",以标签的形式规定网页结构,它是制作网页的标准语言
    HTML不区分大小写

    标签、元素与属性

    1.由尖括号包围,比如<pre><title></pre>
    2.通常是成对出现的,也可以单独出现。
    标签要有正确的嵌套,如:
    <pre><html><bodt></body><html></pre>
    标签加上标签里的内容就变成了元素。如:
    <title>hello,world</title>就是一个元素。
    被嵌套的元素称为嵌套元素的子元素,反之可以说是父元素,同级元素是兄弟元素,如:

      外层:父元素
        内层:子元素
            同级:兄弟元素
        内层:子元素	
       
    

    这些关系可以用一个树来表示,我们称为:HTML DOM树(Document Object Model)(文档对象模型)
    标签中可以带有一些属性来描述这个标签,属性的顺序无关。

    HTML的文件结构

    第一行会有一个<!DOCTYPE html>表示文档类型符合html5标准
    最外层有一堆html标签,表示文件的开始和结束,它的lang属性代表其是中文网页还是英文网页,提供给搜索引擎,内部第一个部分比较重要的一堆head标签,它表示的就是文件的头部信息,这是网页对浏览器和搜索引擎提供的信息。
    内层标签body表示网页的主题内容,网页的主题内容会呈现在浏览器的主体部分。

    
    
       
       Document
    
    
    
    
    

    HTML编辑器

    记事本
    Adobe DW
    Sublime Text3
    webstorm

    html标签

    html:代表文件的开始和结束,它的属性有lang,表示其为什么类型的网页。
    meta:meta表示文件的元数据,具体可见博客HTML meta标签总结与属性使用介绍
    注意,meta的字符集属性必须与文件的保存字符集属性相同。
    h1~h6:标题标签,标题级数越大,字体大小越小,通常一个网页只有一个h1。
    p:段落标签,每个段落自动换行,段落内部文字忽略连续空格(可以用&nbsp),也不会显示空行,且不会换行
    br:段内换行,记得加斜杠。
    pre:预留格式标签,文本中的空格和换行符会被保留,适合显示计算机代码。
    span:组合行内元素,以便通过CSS样式来格式化。
    hr:水平线标签,添加水平线。
    !-- --:注释标签。
    a:超链接标签,用于链接其他网页,href属性用于说明链接网址,需要说明协议名字(如:http://),也可以使用虚拟超链接,用#表示。
    img:插入图像标签,src属性:文件路径+文件名,表示图片的地址,alt属性表示图片无法显示时显示的文本。
    div:区域标签,属性:id(CSS中用),align:对齐方式。
    ul:无序列表
    ol:有序列表
    li:列表项
    table:表格标签,属性border表示表格的宽度
    tr:表示table row,即表格的行。
    td:表示表格的列。
    th:把表格元素加粗显示。
    form:表单标签,action属性与后端相关。
    input:文本输入框/按钮,type属性,代表文本框类型,如text,password。name属性供给后端,如果type为submit、reset、radio和checkbox会有value属性,checked属性规定该选项是否已被选择。对了一组单选框name属性一定要一致啊。
    select:下拉列表框标签。
    option:选项标签,selected属性表示默认的选项。
    textarea:文本区标签,属性cols代表列,rows代表行。

    相关博客

    HTML标签----图文详解

  • 相关阅读:
    TIB上海工作室成立!
    广州沙龙截止报名
    【广州】QTP自动化测试实战训练
    TIB自动化测试快讯 自动化测试空间一周精选(20111120)
    单一世界十万在线webgame的设计思路(一) 服务器数量预估
    JQuery 和 json.js 冲突问题
    公布一个小webgame代码
    dimensions.js 和 jquery UI 有冲突
    webgame创意之《吞噬者》
    c# 停止和开启 IIS 7.0 站点的方法
  • 原文地址:https://www.cnblogs.com/z-y-k/p/11503620.html
Copyright © 2011-2022 走看看