Front-end day1

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Front-end day1相关的知识,希望对你有一定的参考价值。

Front-end day1


1.前端三把刀:
    1.html(好比人的骨架)(各种各样标签)
        (HyperText Markup Language:超文本标记语言,通过标记符号来显示网页中的各个部分。)
    2.css (好比衣服)    (各种显示效果)
        (Cascading Style Sheets:层叠样式表,用于定义HTML元素的显示形式。)
    3.java script(让人动起来)(页面动起来)
        (直译式脚本语言,应用于web应用开发,为网页添加各式各样的动态功能。)
        (jQuery 相当于javascript的一个类库)

2.HTML是什么?
        服务端→返回到→浏览器→可识别的一种形式,这种方式叫做html。

3.HTML头部信息
    1.文档树(后续附图片)
    2.<!DOCTYPE html>
        <!DOCTYPE> 声明必须是 HTML 文档的第一行,位于 <html> 标签之前。
        <!DOCTYPE> 声明不是 HTML 标签;它是指示 web 浏览器关于页面使用哪个 HTML 版本进行编写的指令。
    3.<head>内容</head>
        头部信息:定义内在的东西,网页是不显示的,除了title标签。
    4.<body></body>
        主题内容:定义用户看到的东西
    5.头部事例:
        <head>
            <meta charset="UTF-8" />
            <title>Title</title>
        </head>
    6.头部标签
        1.meta标签
            <meta charset="UTF-8" />
                1.自闭和标签,类似encoding,
                2.为了区别自闭和标签和普通标签,在结尾加一个/ 。
                3.页面编码:charset="UTF-8"
                4.页面定时刷新:
                    例如:每2s刷新
                    <meta http-equiv="refresh" content="2" />
                5.页面定时刷新跳转到某网页:
                    <meta http-equiv="refresh" content="2;Url=http://www.baidu.com" />
                6.定义针对搜索引擎的关键词:
                    <meta name="keywords" content="html css xml" />
                7.定义对页面的描述:
                    <meta name="description" content="免费的前端教程" />
                8.定义页面的最新版本:
                    <meta name="revised" content="abc 2016/9/21">
                9.X-UA-Compatible(兼容ie,专门为IE提供)
                    代表用IE最新内核处理网页:
                    <meta http-equiv="X-UA-COMPATIBLE" content="IE=edge">
                注意:
                    1.<和字母之间不能有空格;
                            正确:<meta />     错误:< meta />
                    2.<>里边的引号不能是中文的。
                总结meta标签属性:
                    charset:定义文档的字符编码。
                    content:定义与 http-equiv 或 name 属性相关的元信息。
                    http-equiv:把 content 属性关联到 HTTP 头部。
                    name:把 content 属性关联到一个名称。

        2.title标签
            <title>Title</title>
            网站的头部信息,用户可见。
            一般不加属性
            主动闭合标签,需要加</title>
            注意:
                如果不加</title>,浏览器会报错,但不显示报错信息,会一直卡在那里。
        3.link标签
            1.css 引入css样式
                <link rel="stylesheet" type="text/css" href="/c5.css">
            2.icon 引入icon图片:链接网页头部图标
                <link rel="shortcut icon" href="favicon.ico">
        4.style
            在页面中写样式,例如:
              <style>
                    .aa {
                            background-color: red;
                            color: white;
                    }
              </style>
        5.script
            1.引入css文件
            2.引入js文件
    7.注释格式
            <!--xxx-->
            PyCharm 里边注释,在字体所在行,按Ctrl+? 自动添加注释。


本文出自 “杨栋豪” 博客,请务必保留此出处http://506554897.blog.51cto.com/2823970/1855122

以上是关于Front-end day1的主要内容,如果未能解决你的问题,请参考以下文章

Web front-end learning about Text and paragraph

The Front-End Checklist

前端 | Front-End

64551 Front-End Developer (Angular)

Front-End——工具使用

Front-end 前端优化总结