前端学习之路-CSS介绍,Html介绍,JavaScript介绍
标题图
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
选择器名称 {
属性名:属性值;
…….
}
属性与属性之间用 分号 隔开
属性与属性值用 冒号 连接
选择器
class
选择器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>
脚本代码的位置
在
<head></head>
标记对之间放置在
<body></body>
标记对之间放置
变量
变量名以字母或下划线("_")开头
变量可以包含数字、从 A 至 Z 的大小写字母JavaScript
区分大小写
变量的声明和赋值
定义变量:var name;
赋值:name = dashucoding;
常量
整型
浮点型
字符串型
数据类型
弱类型,区分大小写
数值型
整型、浮点型
字符串型
单引号或双引号引起来
布尔型
true, false
Null、undefined
运算符
算术运算符
+、-、 * 、 / 、%、++、--
比较运算符
==、!=、>、>=、<、<=
逻辑运算符
&&、||、!
条件运算符
?:
函数
function 函数名(参数...){ 执行语句; return 返回值; }
数组
var arr = new Array();
for(var x=0; x<arr.length; x++){ alert(arr[x]); }
循环语句
for语句
while语句
for…in语句
中断循环语句
for(初始化; 条件; 增量){ 语句; }
while(条件){ 语句; }
for(变量 in 对象){ 语句; }
作者:达叔小生
链接:https://www.jianshu.com/p/5a85cd80a0a9
共同学习,写下你的评论
评论加载中...
作者其他优质文章