• 前端学习之路-CSS介绍,Html介绍,JavaScript介绍


    标题图

    CSS介绍

    学前端必备掌握CSS样式,css为层叠样式表,用来定义页面的显示效果,加强用户的体验乐趣,那么如何用csshtml中呢?

    style属性方式

    利用标签中的style属性来改变显示样式

    <p style="background-color: #FFF000">
     p标签
    </p>

    head中加入style标签

    <head>
     <style type=”text/css”>
      p { color: #FFF000;}
     </style>
    </head>

    链接方式

    <link rel="stylesheet" type="text/css" href="head.css" media="screen" />

    总结CSS

    选择器名称 {
    属性名:属性值;
    …….
    }

    属性与属性之间用 分号 隔开
    属性与属性值用 冒号 连接

    选择器

    1. class选择器
    2. id选择器

    . class
    # id

    Html

    html为超文本标记语言,通过标签来定义的语言,代码不用区分大小写。

    头标签

    <head></head>

    :指定浏览器中标题栏显示的内容。
    :网页的描述信息。

    在标签中常用:

    字体

    <font size=5 color=red>

    标题标签:

    …..

    列表

    <dl>
     <dt>名称</dt>
      <dd>Tom</dd>
     <dt>名称</dt>
      <dd>Tom</dd>
    </dl>
    <ol> <ul> <li>

    图像

    图像标签:<img>
    图像地图:<map>

    表格

    表格标签:<table>
    标题<caption> 表头<th><tr> 单元格<td>
    <table border="1" width=”100%”>
        <caption>表格标题</caption>
        <tr algin=”center”>
            <th>姓名</th>
            <th>年龄</th>
        </tr>
        <tr algin=”center”>
            <td>dashucoding</td>
            <td>10</td>
        </tr>
    </table>

    超链接

    超链接<a href=””>
    
    定位标记<a href=”#标记”>

    表单

    • 文本框 text
    • 密码框 password
    • 单选框 radio
    • 复选框 checkbox
    • 提交按钮 submit
    • 重置按钮 reset
    • 按钮 button
    • 图像 image

    JavaScript介绍

    JavaScript是基于对象和事件驱动的脚本语言,为html提供信息的动态交互,安全性高,跨平台性强。JS是基于对象,且是弱类型。

    引入:

    <script src=”test.js” type=”text/javascript”></script>

    JavaScript脚本代码嵌入到HTML文档中

    <script language="javascript" type="text/javascript">
        document.write("欢迎来到JavaScript世界!");
    </script>
    <script language="javascript" src="javascript.js"></script>
    <input type="button" name="mybtn" value="伪URL引入" onclick="javascript:alert('鼠标单击!')"> 
    <script language="javascript" type="text/javascript">
    function clickme()
    {
        alert("鼠标单击!");
    }
    </script>
    
    <form name="myform">
       <input type="button" name="mybtn" value="按钮" onclick="clickme()">
    </form>

    脚本代码的位置

    1. <head></head>标记对之间放置
    2. <body></body>标记对之间放置

    变量

    变量名以字母或下划线(”_”)开头
    变量可以包含数字、从 A 至 Z 的大小写字母
    JavaScript区分大小写

    变量的声明和赋值

    定义变量:var name;
    赋值:name = dashucoding;

    常量

    1. 整型
    2. 浮点型
    3. 字符串型
    4. 数据类型
    5. 弱类型,区分大小写

    数值型

    整型、浮点型
    字符串型
    单引号或双引号引起来
    布尔型
    true, false
    Null、undefined

    运算符

    算术运算符

    +- *  / 、%、++--

    比较运算符

    ==、!=、>、>=、<、<=

    逻辑运算符

    &&、||、!

    条件运算符

    ?:

    函数

    function  函数名(参数...){
        执行语句;
        return 返回值;
    }

    数组

    var arr = new Array();
    for(var x=0; x<arr.length; x++){
        alert(arr[x]);
    }

    循环语句

    1. for语句
    2. while语句
    3. for…in语句
    4. 中断循环语句
    for(初始化;  条件;  增量){
        语句;
    }
    while(条件){                                  
        语句;             
    }
    for(变量  in  对象){
        语句;
    }

    结语

    • 本文主要讲解 前端学习之路-CSS介绍,Html介绍,JavaScript介绍
    • 下面我将继续对Java、 Android中的其他知识 深入讲解 ,有兴趣可以继续关注
    • 小礼物走一走 or 点赞

    送❤

  • 相关阅读:
    理解JavaScript Call()函数原理。
    数据结构水题大赛官方题解#3 XXX的stl
    数据结构水题大赛官方题解#2 XXX的脑白金
    数据结构水题大赛官方题解#1 XXX的面试
    P3390 矩阵快速幂
    2020.6.8 T1 棋子移动
    U68862 奶牛滑迷宫
    5月18日考试错误题目走迷宫
    最小生成树两种算法详解
    p1220关路灯(小优化)
  • 原文地址:https://www.cnblogs.com/dashucoding/p/11932526.html
Copyright © 2020-2023  润新知