• HTML基础


     
     
    1. HTML
    超文本标记语言、英文全拼:HyperText Markup Language。负责网页的语义描述。
    1. HTML基本骨架
    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>
    </body>
    </html>
    Doctype:文本类型 如果仅写:html那么这代表是html5的网页类型,它符合w3c的标准。
    Html:根目录标签,包含了网页的所有内容
    Head:负责页面的属性配置,不做任何显示性内容操作。
    Meta:翻译为,代表基本属性。
    Charset:字符集,它是告诉浏览器当前网页使用的是哪一种编码标准
    能够支持中的编码有两种:
    第一种utf8国际编码
    第二种gb2312中文编码,中文的文本库加上外语的一些通用字符语言
    Utf8编码>gb2312编码(文本库内容),utf8每个汉字占用3个字符,在gb2312种只占2个字符。
    使用gb2312优点: 小,速度快!
    以后我们的课程中一般就会使用utf8编码,因为我们懒,我就不想改!
    注意:文本保存的编码格式一定要和页面内部声明的编码格式完全相同,不然会出现乱码!!!!
    <meta name="keywords" content="网易,邮箱,游戏,新闻,体育,娱乐,女性,亚运,论坛,短信,数码,汽车,手机,财经,科技,相册"/>
    Keywords:网页搜索关键字,搜索这些关键字可以找到我们的网页
        <meta name="Description" content="网易是中国领先的互联网技术公司,为用户提供免费邮箱、游戏、搜索引擎服务,开设新闻、娱乐、体育等30多个内容频道,及博客、视频、论坛等互动交流,网聚人的力量。" />
    Description:网页描述,提供给用户看到页面的介绍,利于搜索引擎优化(SEO)
    Title:网页标题、搜索引擎优化。
    Body:网页内容标签,他就是一个大的容器。我们所有语义化标签都在body中。
    1. HTML中基本的语法特性
    1. 在html中对换行以及缩进不敏感,但是一定要注意网页中结构的嵌套!
    2. Html中空白折叠现象,html文本中所有的换行、缩进、空格最终都会折叠为一个空格来展示。
    3. Html中标签一定要严格封闭。
    1. html中文本标签
    1. h1-h6标签,标题标签
    2. p标签:段落标签,一般只存放文本、图像或者a链接标签等。注意:p标签中不要放h标签。
    3. stong:文本加粗
    4. I:文本倾斜
    5. Em:文本倾斜
    6. Big:大字体标签
    7. Small:小字体标签
    8. Sup:添加文本上标
    9. Sub:添加文本的下标
    从3-9为文本格式化标签,为了突出着重描述某个或某段字体。
    1. 图像标签
    Img:英文全拼image-图像。
    Src:英文全拼 source-来源路径,这个属性我们写图像的路径。
    绝对路径:当前文件所在你计算机的完整路径。
    相对路径:首先要有参照路径,参照路径就是当前html页面所在的文件路径。然后根据参照路径查找图片路径
     举例:参照路径:C:UserseverDesktop青岛-H5课上代码10.24
    图片路径1:C:UserseverDesktop青岛-H5课上代码图片素材  答案:../图片素材/04.jpg
    图片路径2:C:UserseverDesktop青岛-H5课上代码10.24图片素材 答案:图片素材/04.jpg
    图片路径3:C:UserseverDesktop青岛-H5图片素材 答案:../../图片素材/04.jpg
    Alt:提示属性,图片在不显示的情况下,给用户的提示文字。
    Img标签在写路径时一定要加上扩展名,而且能够支持的图片类型有:jpg、jpeg、png、bmp、gif。 最好加上width和height属性,这是为了性能考虑。
    1. 锚点链接标签
    a标签:超级链接标签,是联通各个页面之间的锚点。
    Href属性:将要打开查看的链接地址。
    Title属性:当鼠标悬停时的给用户看的提示文本。
    Target属性:_blank设置链接打开时将使用新的页面
    页内锚点:需要有两个a链接标签相互对应,并且其中之一的a链接需要设置name或者id属性
    例如:
    <a href="#lsyg">查看历史沿革</a>
    <h1><a name="lsyg">历史沿革</a></h1>
    跨页面的锚点跳转,例子:
    <a href="04-页面内的锚点.html#bxtj">办学条件</a>
    1. 列表
    无序列表:ul标签,里面包含着li标签。li标签代表的是每一项。
    注意:li标签是不可以单独写的,必须嵌套在ul或者ol中.
    有序列表:ol标签,和无序列表类似。
    无序列表与有序列表的不同点:无序列表在页面中的语义是无序的,有序列表在页面中的语义是有顺序我们可以看的到的。
    注意:ul或者ol中只能放li标签,但是li标签中可以放任何元素。
    自定义列表:dl标签,里面包含了两个标签dt和dd。
    dt标签:列表的小标题。
    Dd标签:列表项。
    快捷键:ul>li{li中显示的文本内容}*5
    1. table表
    Table标签:表的语义
    Tr:tablerow 行标签,代表一行
    Td: 列标签,代表一列。
    一般td标签被包含在tr标签中
    Th:表中标题标签。
    1. Div
        Html中非常非常重要的一个标签,从我们单独拿出来说就足以看得出对它的重视。
    在div标签中可以放任何的标签,包括div标签。
    Span标签:普通的文本标签,是行内标签。它主要是给某段文字设置不同的演示,体现出文本的不同需求。
    1. 其他标签
    Br标签:换行标签,
    Hr标签:水平分割线
    &nbsp; : 空格符号
    &copy; 版权符号
    1. 添加标题的ICON
    <link rel=shortcut icon href=aa.icon>
  • 相关阅读:
    指向老域名的反链丢失问题
    oracle express介绍
    VB6:通过ADO访问Oracle存储过程返回的结果集
    Oracle学习笔记:理解oracle的编程接口oo4o的对象模型
    Oracle学习笔记:oracle的编程接口
    VB6:编写一个分析sqlserver存储过程执行语句"execute procedurename par1,par2,......."语法是否正确的函数
    惊喜!使用Regcure修复注册表错误,Oracle客户端可以使用了
    最新30佳精美的名片设计作品欣赏
    28个经过重新设计的著名博客案例
    向设计师推荐20款漂亮的免费英文字体
  • 原文地址:https://www.cnblogs.com/RAINHAN/p/6180789.html
Copyright © 2020-2023  润新知