文档章节

【嘉兴东臣PHP】HTML+CSS+JS 周总结

哈哈哈哈-
 哈哈哈哈-
发布于 2015/12/13 18:08
字数 1861
阅读 14
收藏 0

一、HTML

    <!--注释-->

    <h1>标题,<hx>字号逐级变小;<p>定义段落,在其前后创建一些空白;

    <body>主体文档;img图片标签:例<img src="1.jpg">;

    <head>标签用于定义文档的头部;<title>网页的标题信息,出现在标题栏;<html>根标签;

    <strong>粗体;<em>斜体;<span>设置单独的样式;<br/>换行标签;

    &nbsp;空格  ;<hr/>分隔的横线;

    ul-li标签:无序列表(默认每项li前者自带一个圆点);

    ol-li标签:有序列表(默认每项li前都自带一个序号);

    <div>容器   div的命名:例<div id="版块名称">--</div>;

    <table>:表格;<tr>表格的行;<td>表格某行的列;

    为表格加入边框style="border:1px solid #000";

    <cpation>表格标题;

    <a>标签:链接到另一个页面:<a href="目标网址" title="鼠标滑过显示的文本">文本</a>;

    链接网页在新的浏览器窗口中打开:<a href="目标网址" target="_blank">文本</a>;

    <input type="text"/> text 文本输入框 ;<input type="button"/>button 按钮;

    <input type="submit"/>submit 提交按钮 ;<input type="file"/>file 上传 ;

    <input type="password"/>password密码输入框;

    <textarea>文本域 <textarea rows="行数" cols="列数">文本</textarea>

    <input type="radio/checkbox" value="值" checked="checked"(默认选中)/>radio 单选框, checkbox 复选框;

    <select><option>文本</option></select>创建下拉列表框  selected="selected" 默认选中;

   

二、CSS

    /*注释语句*/;font-size:字体大小;color:字体颜色;font-weight:字体粗细;

    字体对齐方式:text-align属性:left,right,center;

    控件对齐方式:float属性:left,right;

    cursor:pointer; 显示手势;

    display: block(显示)、none(隐藏)显示文字或者控件;

    background-color:rgba(0,0,0,0.5);设置DIV透明度

    盒模型:

        margin:外边距;设置字体、控件的边距,margin: 上边距 右边距 下边距 左边距,例如:margin:10px 20px 30px  40px ,注意:中间都有空格,如果不想设置边距,可以用0px,或者0表示,在设置时候可以直接设置左边距如:margin-left:30px等;

    padding:外边距;设置字体、控件的边距,padding: 上边距 右边距 下边距 左边距,例如:padding:10px 20px 30px  40px ,注意:中间都有空格,如果不想设置边距,可以用0px,或者0表示,在设置时候可以直接设置左边距如:padding-left:30px等;

        边框:

            border-style(边框样式)常见样式有:

                dashed虚线 | dotted点线 | solid实线

            border-color(边框颜色)

            border-weidth(边框宽度)

            只为一个方向边框设置形式:

                上:border-top

                右:border-right

                下:border-bottom

                左:border-left

        width 宽;height 高;

    CSS样式的插入方式:

        内联式:把CSS代码直接写在现有的HTML标签中,例如:<p style="color:red">这里文字是红色</p>;

        嵌入式:把CSS样式代码写在<style type="text/css"></style>标签中;

        外联式:把CSS代码写在一个单独的外部文件中,这个CSS样式文件以".css"为扩展名,在<head>内使用<link>标签将CSS样式文件链接到HTML文件内,如:<link href="base.css" rel="stylesheet" type="text/css">;

    选择器{

        样式;

    }

    类选择器:.(类选择器名称){CSS样式代码;}

        1.英文圆点开头;2、其中类选择器名称可以任意起名;

        (1)<span class="stress">文本</span>

        (2).stress{color:red;}

    ID选择器:1、为标签设置id="ID名称",而不是class="类名称";

                     2、ID选择符的前面是(#)号,而不是英文圆点(.);

    ID选择器和类选择器的区别:(1)ID在文档中只能使用一次,而类可多次;

                                               (2)类可为一个元素同时设置多个样式而ID不行;


三、JS

    function 函数名(){ } 定义一个函数,函数名() 调用了一个函数
    alert(“内容”); 警告框
    document.write("内容");写入一个内容,可以加入HTML代码
    confirm(“内容”); 是确认框
    window.close 关闭窗口 IE
    关键字:又叫保留字,特指语言中内部所使用单词,这些单词禁止用来做 变量、常量或者函数的名字。
    标识符:是告诉你 变量、常量或者函数的名字只能 字母、下划线、$符号开头。
    转义符:可以经常用\ 转义某一个特殊符号 如" 能让脚本正常运行。
    变量:可以改变的量,如数值、字符串、浮点、布尔:
        变量用var申明。例如var a = 10;这就是告诉你,一个名字叫a的变量赋了一个初始值为10;注意10为整型。
    常量:不能改变的量,常量用const申明,例如:const b = 10;这就是告诉你,一个名字叫b的常量值为10,并且这个值不能改变,除非你销毁它;
    document.writeln("<pre>") 支持转义字符,如\n换行等,注意:必须在<pre> </pre> 之间写转义;
    undenfied 是指找不到某一个对象的属性或者某一个变量,没有赋初始值;
    null 是指空置,特指找到了属性,但是找不到或者获取不到值。所以为空;
    全局变量和局部变量,一般发生在作用域之内,全局变量一般是在函数的之外,局部的是在函数的里面的;
    + 在通常的情况下是表示字符串的连接符,例如:"a"+"b" 输出的就是ab,
    + 在字符串和任何的类型都是连接符。
    + 在整型之间的是做加法运算符。
    其他的 - * / 都是运算符,但是注意:如果强制让一个字符串运算的话,结果是NaN,就是特指未知的值。
    parseInt() 将其他类型转化为整型,注意转化整型是从左往右,取出全部的整型,当遇到第一个非整型的值时结束。
    parseFloat() 将其他类型转化为浮点型。
    .style 利用JS设置CSS样式 如document.getElementById("login_message").style.display = "none";

    运算符分类
        1、算术运算符:+ - * /
        2、比较运算符:> < == >= <=
        3、赋值运算符:a = b
        4、逻辑运算符:&&(同时满足),||(或,满足一个),!(非,取反值)。
        5、条件运算符:条件 ?条件成立 : 条件不成立
       (1) 注意:比较运算符返回,布尔类型也就是true或者false。
        (2)注意:&&(与)运算符,如果两个数比较的话,返回后者,注意:同时满足才会满足。
        (3)注意:或运算符,如果两个数比较的话,或运算符的特点就是满足一个就是满足,后面的相当于不需要看,所以只要前面满足,返回就是前面后面。

    条件判断
        1、第一种形式
        if(条件){
        
        }else{
        
        }
        2、第二种形式
        if(条件){

        }else if(条件){

        }else{

        }
        3、第三种形式
        if(条件){
            if(条件){

            }else{

            }        
        }else{

        }   

    while的基本写法:
        while(条件){
            循环操作
        }
    注意:不要死循环,切记不到万不得已,不要写true。有个限制才会从while循环里出来。

    do..while:也是循环写法和while的区别就是:
        do..while 先执行一次再判断条件,while先判断条件,再看是否执行。
            
        for( 初始值;条件 ;自增自减情况 ;){
            
        }

    switch(){
            case 0:
            case 1:
            default:
        }
        注意:default用于默认情况,也就是都不满足的情况下执行。
        break:在英文单词上的意思是打破,在程序中的意思是跳出当前循环。
        contiue:在英文单词上的意思是继续,在程序中的意思是跳出当前循环,进入下一个循环。


    ++ 自增,++i 与 i++ 的区别:
        (1)++i:先++再赋值;
        (2)i++:先赋值再++;                                         

       



© 著作权归作者所有

共有 人打赏支持
哈哈哈哈-
粉丝 0
博文 6
码字总数 6540
作品 0
嘉兴
【嘉兴东臣php】JS BOM和DOM学习周总结

一.集合 打印数组的两种方法: (未知长度) var list= [2,4,6,8,10]; for(var i=0;i<list.length;i++){ console.log(list[i]); } (超出数组长度,数组值为undefined) var list= [2,4,6,8...

林酥奇奥
2015/12/19
121
0
php, 不使用模板引擎,如何实现前端和后端协作?

看了一会smarty感觉有点难度,php,不使用模板引擎。 如何实现前端和后端协作?我想把后端的代码先写好,然后再来写前端的工作html+css+js。

Helloall
2014/08/03
2.7K
18
请问一个web开发的问题,请指点~

如何让前端html+css+js开发和后端php+pgsql开发结合起来???这两者要如何结合起来?新学,对这个有点模糊,请各位前辈指点。~

Helloall
2014/08/03
140
2
OSC 招聘( 0x12 期-那些小而美的公司 )

被彭博商业周刊称为「硅谷人脉王」的LinkedIn创始人里德·霍夫曼最著的书——《联盟》是一本谈论当今这个时代雇主与雇员的关系的书。当今时代的雇主和雇员是什么关系?即使再天真的雇员,也不...

oschina
2016/06/22
3K
3
适合初级前端程序员:闭包是什么?

是什么? 当一个嵌套的内部函数引用了外部函数的变量或者函数时,外部函数在执行时就产生了闭包 典型的闭包 将另一个函数作为另一个函数的返回值 将函数作为实参传递给另一个函数调用 闭包的...

IT智云编程
07/12
0
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

困扰当前数据中心管理的三大难题

导读 当企业发展到一定程度,或者之前的机房不能满足现在的数据中心使用时,企业会对数据中心进行迁移。那么在数据中心进行迁移的时候会遇到哪些风险呢?针对这些风险我们应该做出怎样的措施来...

问题终结者
6分钟前
0
0
设计模式:工厂方法模式(工厂模式)

工厂方法模式才是真正的工厂模式,前面讲到的静态工厂模式实际上不能说是一种真正意义上的设计模式,只是一种变成习惯。 工厂方法的类图: 这里面涉及到四个种类: 1、抽象产品: Product 2、...

京一
22分钟前
0
0
区块链和数据库,技术到底有何区别?

关于数据库和区块链,总会有很多的困惑。区块链其实是一种数据库,因为他是数字账本,并且在区块的数据结构上存储信息。数据库中存储信息的结构被称为表格。但是,区块链是数据库,数据库可不...

HiBlock
30分钟前
0
0
react native 开发碰到的问题

react-navigation v2 问题 问题: static navigationOptions = ({navigation, navigationOptions}) => ({ headerTitle: ( <Text style={{color:"#fff"}}>我的</Text> ), headerRight: ( <View......

罗培海
37分钟前
0
0
Mac Docker安装流程

久仰Docker大名已久,于是今天趁着有空,尝试了一下Docker 先是从docker的官网上下载下来mac版本的docker安装包,安装很简易,就直接拖图标就好了。 https://www.docker.com/products/docker...

writeademo
45分钟前
0
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部