CSS介绍

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

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是基于对象，且是弱类型。

引入：

将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 点赞

前端学习之路-CSS介绍，Html介绍，JavaScript介绍的更多相关文章

  1. Day3前端学习之路——CSS基本知识

    课程目标 初步了解什么是CSS,掌握基本的CSS概念,语法,针对选择器特殊性的计算处理,以及学习如何设置一些简单的样式 任务一:回答问题 1.什么是CSS,CSS是如何工作的? CSS 指层叠样式表 ...

  2. 前端学习之路CSS基础学习二

    CSS属性相关 样式操作: (1)width:为元素设置宽度 (2)height:为元素设置高度 ps:块儿级标签才能设置长宽行内标签设置长宽没有任何影响 p{ width: 30px; height ...

  3. 前端学习之路CSS基础学习一

    CSS CSS定义如何显示HTML元素,当浏览器读到一个样式表,它就按照这个样式表来对文档进行格式化. CSS实例 每个CSS样式由两个组成部分:选择器和声明.声明又包括包括属性和属性值.每个声明之后 ...

  4. jQuery延迟加载(懒加载)插件 – jquery.lazyload.js-Web前端(W3Cways.com) - Web前端学习之路

    Lazy Load 是一个用 JavaScript 编写的 jQuery 插件. 它可以延迟加载长页面中的图片. 在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动到它们所在的位置. 这与图片预 ...

  5. web前端学习之HTML CSS/javascript之一

    前端编码之路之坎坷,web前端应该一直是个战场吧,各种浏览器的不兼容,各种小细节的修改,要往一个好的产品经理方向走,实在是难,昨天听了一位十年经验的产品经理讲座,最重要的恐怕就是协调资源的能力,而协调 ...

  6. 前端学习-基础部分-css（一）

    开始今日份整理 1.CSS的导入方式 CSS的导入方式主要是有内联模式,行内模式,外部样式表 1.1 内联模式 内联模式:直接在<head>中直接写css,例如 p{ color:rgb( ...

  7. 前端学习（十五）：了解 Javascript

    进击のpython ***** 前端学习--了解JavaScript Javascript是一种运行在浏览器中的解释型的编程语言 还记得我们在说python的时候提过解释型和编译型的区别 在解释型语言 ...

  8. 前端学习笔记之CSS介绍

    阅读目录 一 什么是CSS 二 为何要用CSS 三 如何使用CSS 一 什么是CSS CSS全称Cascading Style Sheet层叠样式表,是专用用来为HTML标签添加样式的. 样式指的是H ...

  9. zigbee学习之路(十二):zigbee协议原理介绍

    一.前言 从今天开始,我们要正式开始进行zigbee相关的通信实验了,我所使用的协议栈是ZStack 是TI ZStack-CC2530-2.3.0-1.4.0版本,大家也可以从TI的官网上直接下载T ...

随机推荐

  1. UI5-学习篇-17-云端WEB IDE开发

    1.前提条件 SAP云平台账号已申请 云连接器设置完成:UI5-学习篇-15-云连接SAP Cloud Connector 云平台Destination设置完成:UI5-学习篇-16-云端SCP-De ...

  2. SQL 中的语法顺序与执行顺序

    FROM : HOME SQL 是一种声明式语言 SQL 语言是为计算机声明了一个你想从原始数据中获得什么样的结果的一个范例,而不是告诉计算机如何能够得到结果. SQL 语言声明的是结果集的属性,计算 ...

  3. python中subprocess模块

    subprocess  模块 subprocess称之为子进程,进程是一个正在进行的程序 子进程是由另一个正在运行的程序启动的程序,例如QQ聊天点击一个链接,打开了浏览器,那么浏览器称之为QQ的子进程 ...

  4. Keepalived+MySQL实现高可用

    MySQL的高可用方案有很多,比如Cluster,MMM,MHA,DRBD等,这些都比较复杂,我前面的文章也有介绍.最近Oracle官方也推出了Fabric.有时我们不需要这么复杂的环境,这些方案各有 ...

  5. 关于http以及aphace配置https

    我是通过腾讯云配置的ssl.   网站:www.xian029.cn 免费申请,然后通过phpstudy  来配置的. 密码学:   研究密码编码与解码的学科,可以分为编码学和破译学.   HTTPS ...

  6. Windows 10同步时间的方法

    今天在安装了Windows 10 1809(October 2018 update)之后发现时间不能同步,以前并没有出现这种情况. 1) 打开控制面板,找到时钟域地区 2) 选择日期和时间 3) 选择 ...

  7. viewstate？

    用于存放数据,可永久保存,存放在页面的隐藏控件里      支持string,integer,array,boolean,ArrayList,hashtable类型,使用viewstate会增加页面h ...

  8. vue组件之时间组件

    效果图 主要有两个注意点,前面时分,通过定时器,1秒钟取一次,只要数据变了立刻让他展示,当然也可以1分钟取一次,我看了下定时器和真正的时间 其实有一定的偏差的,大约要1分多才会改变,所以我用了1秒取一 ...

  9. django.core.exceptions.ImproperlyConfigured: Requested setting DEFAULT_INDEX_TABLESPACE, but settings are not configured. You must either define the environment variable DJANGO_SETTINGS_MODULE or call

    Error info: django.core.exceptions.ImproperlyConfigured: Requested setting DEFAULT_INDEX_TABLESPACE, ...

  10. 201621123002《JAVA程序设计》第二周学习总结

    1.本周学习总结 1.重点String类 2.Java的数据类型 3.Java中的引用类,包装类 for(类型 元素变量名(任取):遍历对象(数组名)) 2.书面作业 1.String-使用Eclip ...