为了账号安全,请及时绑定邮箱和手机立即绑定

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

webp

标题图

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>

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

在标签中常用:

字体

<font size=5 color=red>

标题标签:<h1><h2>…..<h6>

列表

<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" class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="javascript.js"></script>
<input type="button" name="mybtn" value="伪URL引入" ="javascript:alert('鼠标单击!')"> 
<script language="javascript" type="text/javascript">function clickme(){
    alert("鼠标单击!");
}</script><form name="myform">   <input type="button" name="mybtn" value="按钮" ="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  对象){
    语句;
}



作者:达叔小生
链接:https://www.jianshu.com/p/5a85cd80a0a9


点击查看更多内容
TA 点赞

若觉得本文不错,就分享一下吧!

评论

作者其他优质文章

正在加载中
  • 推荐
  • 评论
  • 收藏
  • 共同学习,写下你的评论
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦
今天注册有机会得

100积分直接送

付费专栏免费学

大额优惠券免费领

立即参与 放弃机会
意见反馈 帮助中心 APP下载
官方微信

举报

0/150
提交
取消