奈斯凸米特
奈斯凸米特

day21-HTML

1. web基础：

  1. web标准（万维网-w3c）：
    结构标准：HTML --- 决定网页上有什么东西（能够显示什么内容）
    表现标准：CSS --- 决定网页上内容的布局和显示方式
    行为标准：JavaScript（js）--- 决定网页上动态的效果
  2. 认识HTML
    HTML是超文本标记语言（可以用来标记文本、图片、视频、音频、flash、按钮、输入框等内容）。
    HTML不是编程语言，不会编译执行，语法错误也不会报错导致程序不能往后运行。
  3. HTML版本
    广义的H5：指HTML5+CSS3+JS
    狭义的H5：指HTML5
  4. HTML编程
    a. HTML标记语言对应的文件的后缀，一般都是html
    b. HTML的结构：整个html是通过不同的标记来组成
  5. 标签/标记
    a. 双标签（常规标签）
    <标签名 属性=属性值 属性=属性值>标签内容
    b. 单标签（自闭合标签）
    <标签名 属性=属性值 属性=属性值 />
    <标签名 属性=属性值 属性=属性值>

说明：
标签名：HTML标准中固定的（注意：< 和标签名之间不能有空白）
属性：属性和标签名之间用空格隔开，以属性=属性值的形式存在，多个属性之间也用空格隔开
（属性可以是HTMl标准中的属性，也可以是自定义的属性）
标签内容：是指开始标签和结束标签之间的内容。标签的内容可以是任何内容（可以是字符串，也可以是其他任何内容）

补充：HTML语法中，不区分大小写（HTML\html\HtMl是一样的）

  1. 网页的结构


    
        
        
    
    
    






    
    
        
        
        
        HTML基础

2. 文本标签



    
        
        
    
    
        
        
我是标题1

        
我是标题2

        
我是标题3

        
我是标题4

        
我是标题4

        
我是标题4

        
        
        

            哈吉斯客服哈哈对水井坊快乐发考虑安抚较快哈吉斯客服哈哈对水井坊快乐发考虑安抚
            较快哈吉斯客服哈哈对水井坊快乐发考虑安抚较快哈吉斯客服哈哈对水井坊快乐发考虑安
            抚较快哈吉斯客服哈哈对水井坊快乐发考虑安抚较快哈吉斯客服哈哈对水井坊快乐发考虑安
            抚较快哈吉斯客服哈哈对水井坊快乐发考虑安抚较快哈吉斯客服哈哈对水井坊快乐发考虑安抚
            快哈吉斯客服哈哈对水井坊快乐发考虑安抚较快哈吉斯客服哈哈对水井坊快乐发考虑安抚较快
        
        

        

            哈吉斯客服哈哈对水井坊快乐发考虑安抚较快哈吉斯客服哈哈对水井坊快乐发考虑安抚较快
            哈吉斯客服哈哈对水井坊快乐发考虑安抚较快哈吉斯客服哈哈对水井坊快乐发考虑安抚较快
            哈吉斯客服哈哈对水井坊快乐发考虑安抚较快½

        
        
        

            哈吉斯客服哈哈对水井坊快乐发考虑安抚较快哈吉斯客服哈哈对水井坊
        哈吉斯客服哈哈对水井坊快乐发考虑安抚较快哈吉斯客服哈哈对水井坊快乐发考虑安抚较快哈吉斯客
        哈吉斯客服哈哈对水井坊快乐发考虑安抚较快哈吉斯客服哈哈对水井坊快乐发考虑安抚较快
        
        


        
        

            哈吉斯客服哈哈对水井坊快乐发考虑安抚较快

        哈吉斯客服哈哈对水井坊快乐发考虑安抚较快

        哈吉斯客服哈哈对水井坊快乐发考虑安抚较快
        


        
        百度一哈
        
        

        

            哈吉斯客服哈哈对水井坊快乐发考虑安抚较快
空间浪费好多家

        大家的厚爱了体制机制阿拉法阿大声道答道发大发多对多

        哈吉斯客服哈哈对水井坊快乐发考虑安抚较快
        

        

        
        
        

            按时大大啊大大的动力源自创新。总结历史经验，

        我们会发现，体制机制变革释放出的活力和创造力，科技阿达大厦，

        had哈师大空间很大垃圾的良好

3. 列表



    
        
        
    
    
        
            
    
                
  1. 语文
    2. 
                
  2. 数学
    3. 
                
  3. 英语
    4. 
                
            

        
    
            
  • 成都
    • 
            
  • 北京
    • 
        

        
        

            
城市：

            
重庆

            
北京

4. 图片和超链接

  1. 图片标签(img)
    a. src属性:图片的地址(本地地址、网络地址)
    本地地址:相对路径(相对于工程目录)
    注意:本地图片需要放到工程目录下的img文件夹下
    b. title属性：图片的标题(鼠标停留在图片上，隔一段时间才显示出来)
    c. alt属性：图片加载失败后显示的提示信息
        
图片1

        
        图片加载失败
        
        
图片2

        
        
图片3

  1. 超链接（a）
    网页上点击后可以跳转的标签都是超链接
    href属性:跳转地址(本地地址，网络地址)
    网络地址：跳转到对应的网页
    本地地址: 当前工程的其他的html文件路径
    空串/#: 刷新页面回到网页的顶部
    选择器：让网页滚动到网页上的任意的位置

  2. target属性：
    _self(默认的): 在当前页面中打开href的地址
    _blank: 在新的页面中打开href的地址

            
        百度一下
        列表
        图片2
        图片11111

5. 表格

table -- 标签代表这个表格
tr -- 代表的是一行
td -- 代表的是列（一个td对应一个单元格）

一个表格中可以有多行，一行有多列

            table属性:
            1.border:设置整个表格中边框的宽度
            2.width:设置整个表格的宽度
            3.heigt:设置整个表格的高度（每一行的高度是一样的）
            4.align：center -- 让整个表在其父标签中居中
            5.bgcolor: 背景颜色
            6.cellpadding="100": 设置内容和单元格之间的间距(了解)
            7.cellspacing: 设置 单元格和单元格之间的间隙
            
            tr属性:
            1.height: 设置单独的某一行的高度
            2.align:center -- 让当前行里面的所有的单元格中的内容居中
            3.bgcolor: 背景颜色
            
            
            td属性:
            1.width： 设置某一列的宽度
            2.align:center -- 让某一个单元格中的内容居中
            3.bgcolor: 背景颜色
            
            
            
            注意:所有的属性的值都要用双引号括起来

        
        

            
            

                
                姓名 
                
                成绩
                
                是否留级
            

            
            

                古双全
                90
                否
            

            
            

                100
                200
                300
            

            
        

        
        

            
            

                Data
                100

6. 复杂的表格



    
        
        复杂表格

作业



    
        
        
        
    
    
        
个人简历表

        

            

                求职意向
                超级英雄
            

            
基本信息

            

                姓名
                Iron Man
                性别
                男
                名族
                战斗名族
                
            

            

                出生日期
                1965年4月4日
                政治面貌
                共青团员
                婚否
                已婚
            

            

                籍贯
                漫威
                现所在地
                美国
                学历
                大学本科
            

            

                毕业院校
                攀枝花学院
                所学专业
                演员
            

            

                电子邮件
                [email protected]
                手机号码
                15082381234
            

            

                教育经历
            

            

                起止时间
                毕业院校/教育机构
                专业/课程
            

            

                1973年-1979年
                漫威小学校
                钢铁是怎样炼成的
            

            

                1980年-1986年
                漫威中学
                钢铁侠的制作
            

            

                1986-1990
                攀枝花学院
                如何拯救地球
            

            
            

                工作经历
            

            

                起止时间
                公司名称及职位
                工作内容
            

            

                2008年-2010年
                漫威公司演员
                扮演钢铁侠
            

            

                2010年-2012年
                漫威公司演员
                出演复仇者联盟
            

            

                2012年-2015年
                漫威公司演员
                荣获第24届MTV电影奖时代大奖
            

            

                技能/爱好
                超级天才，无所不知；力量无穷；能高速飞行；耐揍；能发射激光炮。爱好保护地球。
            

            

                自我评价
                我就是一个超级天才，爱发明，爱运动，团队合作能力很强，曾多次加入复仇者联盟拯救地球。

运行结果：


day21-HTML_第1张图片
1.png

你可能感兴趣的:(day21-HTML)

  • day21-HTML简介 d4lx
    今天开始python学习的第二阶段，进入web前端的学习；一、web前端简介1、web标准web前端的内容：HTML、CSS、JS（JavaScript）；web标准（万维网-W3C指定的）中规定HTML是结构标准，CSS是表现标准，JS是行为标准；HTML结构标准中规定了网页上能够显示的内容，比如文字、图片、音频、视频、Flash、按钮、输入框等CSS表现标准规定网页的内容的布局和样式，比如内容
  • day21-html base Voyaserfuerte
    td{text-align:center;}个人简历学院成都信息工程大学专业电子信息工程姓名XXX性别X民族X出生年月XXX籍贯XXX身高XXX学历XX政治面貌XX就业意向XXX兴趣爱好XXX个人说明XXX家庭住址XXX住宿地址XXX联系电话XXX手机XXX任职情况XXX个人情况时间学校任职XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
  • day21-html作业 向前冲我在路上
    个人简历的制作个人简历个人简历求职意向基本信息姓名吴彦祖性别男民族汉族出生日期政治面貌婚否籍贯现所在地学历毕业时间所学专业电子邮件手机号码教育经历起止时间毕业院校/教育机构专业课程工作经历起止时间公司名称及职位工作内容著名演员业余爱好自我评价作品展示：image.png
  • day21-HTML 奈斯凸米特
    1.web基础：web标准（万维网-w3c）：结构标准：HTML---决定网页上有什么东西（能够显示什么内容）表现标准：CSS---决定网页上内容的布局和显示方式行为标准：JavaScript（js）---决定网页上动态的效果认识HTMLHTML是超文本标记语言（可以用来标记文本、图片、视频、音频、flash、按钮、输入框等内容）。HTML不是编程语言，不会编译执行，语法错误也不会报错导致程序不能
  • day21-HTML 七一欧
    01-web基础:1.web标准:万维网-w3c结构标准:HTML---决定网页上有什么东西(能够显示什么内容)表现标准:CSS---决定网页上内容的布局和显示方式行为标准:JavaScript(js)---决定网页上动态效果2.认识HTMLHTML是超文本标记语言(可以用来标记文本、图片、视频、音频、flash、按钮、输入框等内容)HTML不是编程语言，不会编译执行，语法错误也无法报错，导致程序
  • day21-html基础语法笔记 向前冲我在路上
    一、web基础：web标准:（万维网-W3C）机构标准：HTML---决定网页上有什么东西（能够显示什么内容），给网页提供内容边线标准：CSS----决定网页上内容的布局和显示样式行为标准：javascript(js)--决定网页动态的效果或者变化的页面效果认识HTNLHTML是超文本标记语言（可以用来标记文本、图片、视频、音频、flash、按钮、输入框等内容）。HTNL不是编程语言，不会编译执行
  • day21-html barriers
    1认识html1.1什么是htmlhtml是超文本标记语言超文本：除了文字以外，还可以对图片、视频、音频、超链接、按钮、输入框等进行标记标记语言：不是编程语言，和macdown语法一样，只是通过不同的标记让内容以不一样的形式显示出来。如果语法出错不会影响其他正确的标记的效果1.2什么是html文件文件后缀.html的文件；可以直接通过浏览器打开。一般情况下，html代码就写在html文件中1.3h
  • jQuery 键盘事件keydown ,keypress ,keyup介绍 107x jsjquerykeydownkeypresskeyup
    本文章总结了下些关于jQuery 键盘事件keydown ,keypress ,keyup介绍，有需要了解的朋友可参考。 一、首先需要知道的是： 1、keydown() keydown事件会在键盘按下时触发. 2、keyup()  代码如下 复制代码 $('input').keyup(funciton(){      
  • AngularJS中的Promise bijian1013 JavaScriptAngularJSPromise
    一.Promise         Promise是一个接口，它用来处理的对象具有这样的特点：在未来某一时刻（主要是异步调用）会从服务端返回或者被填充属性。其核心是，promise是一个带有then()函数的对象。         为了展示它的优点，下面来看一个例子，其中需要获取用户当前的配置文件： var cu
  • c++ 用数组实现栈类 CrazyMizzz 数据结构C++
    #include<iostream> #include<cassert> using namespace std; template<class T, int SIZE = 50> class Stack{ private: T list[SIZE];//数组存放栈的元素 int top;//栈顶位置 public: Stack(
  • java和c语言的雷同 麦田的设计者 java递归scaner
    软件启动时的初始化代码，加载用户信息2015年5月27号 从头学java二 1、语言的三种基本结构：顺序、选择、循环。废话不多说，需要指出一下几点：      a、return语句的功能除了作为函数返回值以外，还起到结束本函数的功能，return后的语句 不会再继续执行。      b、for循环相比于whi
  • LINUX环境并发服务器的三种实现模型 被触发 linux
    服务器设计技术有很多，按使用的协议来分有TCP服务器和UDP服务器。按处理方式来分有循环服务器和并发服务器。 1  循环服务器与并发服务器模型 在网络程序里面，一般来说都是许多客户对应一个服务器，为了处理客户的请求，对服务端的程序就提出了特殊的要求。 目前最常用的服务器模型有： ·循环服务器：服务器在同一时刻只能响应一个客户端的请求 ·并发服务器：服
  • Oracle数据库查询指令 肆无忌惮_ oracle数据库
    20140920   单表查询 -- 查询************************************************************************************************************ -- 使用scott用户登录   -- 查看emp表   desc emp  
  • ext右下角浮动窗口 知了ing JavaScriptext
    第一种 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/
  • 浅谈REDIS数据库的键值设计 矮蛋蛋 redis
    http://www.cnblogs.com/aidandan/ 原文地址：http://www.hoterran.info/redis_kv_design 丰富的数据结构使得redis的设计非常的有趣。不像关系型数据库那样，DEV和DBA需要深度沟通，review每行sql语句，也不像memcached那样，不需要DBA的参与。redis的DBA需要熟悉数据结构，并能了解使用场景。
  • maven编译可执行jar包 alleni123 maven
    http://stackoverflow.com/questions/574594/how-can-i-create-an-executable-jar-with-dependencies-using-maven <build> <plugins> <plugin> <artifactId>maven-asse
  • 人力资源在现代企业中的作用 百合不是茶 HR 企业管理
    //人力资源在在企业中的作用人力资源为什么会存在，人力资源究竟是干什么的 人力资源管理是对管理模式一次大的创新，人力资源兴起的原因有以下点： 工业时代的国际化竞争，现代市场的风险管控等等。所以人力资源 在现代经济竞争中的优势明显的存在，人力资源在集团类公司中存在着 明显的优势(鸿海集团)，有一次笔者亲自去体验过红海集团的招聘，只 知道人力资源是管理企业招聘的 当时我被招聘上了，当时给我们培训 的人
  • Linux自启动设置详解 bijian1013 linux
    linux有自己一套完整的启动体系，抓住了linux启动的脉络，linux的启动过程将不再神秘。 阅读之前建议先看一下附图。 本文中假设inittab中设置的init tree为： /etc/rc.d/rc0.d /etc/rc.d/rc1.d /etc/rc.d/rc2.d /etc/rc.d/rc3.d /etc/rc.d/rc4.d /etc/rc.d/rc5.d /etc
  • Spring Aop Schema实现 bijian1013 javaspringAOP
    本例使用的是Spring2.5 1.Aop配置文件spring-aop.xml <?xml version="1.0" encoding="UTF-8"?> <beans xmlns="http://www.springframework.org/schema/beans" xmln
  • 【Gson七】Gson预定义类型适配器 bit1129 gson
    Gson提供了丰富的预定义类型适配器，在对象和JSON串之间进行序列化和反序列化时，指定对象和字符串之间的转换方式，   DateTypeAdapter   public final class DateTypeAdapter extends TypeAdapter<Date> { public static final TypeAdapterFacto
  • 【Spark八十八】Spark Streaming累加器操作（updateStateByKey) bit1129 update
    在实时计算的实际应用中，有时除了需要关心一个时间间隔内的数据，有时还可能会对整个实时计算的所有时间间隔内产生的相关数据进行统计。 比如： 对Nginx的access.log实时监控请求404时，有时除了需要统计某个时间间隔内出现的次数，有时还需要统计一整天出现了多少次404，也就是说404监控横跨多个时间间隔。   Spark Streaming的解决方案是累加器，工作原理是，定义
  • linux系统下通过shell脚本快速找到哪个进程在写文件 ronin47
    一个文件正在被进程写 我想查看这个进程 文件一直在增大 找不到谁在写 使用lsof也没找到 这个问题挺有普遍性的，解决方法应该很多，这里我给大家提个比较直观的方法。 linux下每个文件都会在某个块设备上存放，当然也都有相应的inode, 那么透过vfs.write我们就可以知道谁在不停的写入特定的设备上的inode。 幸运的是systemtap的安装包里带了inodewatch.stp，位
  • java-两种方法求第一个最长的可重复子串 bylijinnan java算法
    import java.util.Arrays; import java.util.Collections; import java.util.List; public class MaxPrefix { public static void main(String[] args) { String str="abbdabcdabcx";
  • Netty源码学习-ServerBootstrap启动及事件处理过程 bylijinnan javanetty
    Netty是采用了Reactor模式的多线程版本，建议先看下面这篇文章了解一下Reactor模式： http://bylijinnan.iteye.com/blog/1992325 Netty的启动及事件处理的流程，基本上是按照上面这篇文章来走的 文章里面提到的操作，每一步都能在Netty里面找到对应的代码 其中Reactor里面的Acceptor就对应Netty的ServerBo
  • servelt filter listener 的生命周期 cngolon filterlistenerservelt生命周期
    1. servlet    当第一次请求一个servlet资源时，servlet容器创建这个servlet实例，并调用他的 init(ServletConfig config)做一些初始化的工作，然后调用它的service方法处理请求。当第二次请求这个servlet资源时，servlet容器就不在创建实例，而是直接调用它的service方法处理请求，也就是说
  • jmpopups获取input元素值 ctrain JavaScript
    jmpopups 获取弹出层form表单 首先，我有一个div，里面包含了一个表单，默认是隐藏的，使用jmpopups时，会弹出这个隐藏的div，其实jmpopups是将我们的代码生成一份拷贝。 当我直接获取这个form表单中的文本框时，使用方法：$('#form input[name=test1]').val()；这样是获取不到的。 我们必须到jmpopups生成的代码中去查找这个值，$(
  • vi查找替换命令详解 daizj linux正则表达式替换查找vim
    一、查找 查找命令 /pattern<Enter> ：向下查找pattern匹配字符串 ?pattern<Enter>：向上查找pattern匹配字符串 使用了查找命令之后，使用如下两个键快速查找： n：按照同一方向继续查找 N：按照反方向查找 字符串匹配 pattern是需要匹配的字符串，例如： 1:  /abc<En
  • 对网站中的js,css文件进行打包 dcj3sjt126com PHP打包
    一，为什么要用smarty进行打包 apache中也有给js,css这样的静态文件进行打包压缩的模块，但是本文所说的不是以这种方式进行的打包，而是和smarty结合的方式来把网站中的js,css文件进行打包。 为什么要进行打包呢，主要目的是为了合理的管理自己的代码 。现在有好多网站，你查看一下网站的源码的话，你会发现网站的头部有大量的JS文件和CSS文件，网站的尾部也有可能有大量的J
  • php Yii: 出现undefined offset 或者 undefined index解决方案 dcj3sjt126com undefined
    在开发Yii 时，在程序中定义了如下方式：        if($this->menuoption[2] === 'test')，那么在运行程序时会报：undefined offset:2，这样的错误主要是由于php.ini 里的错误等级太高了，在windows下错误等级
  • linux 文件格式（1） sed工具 eksliang linuxlinux sed工具sed工具linux sed详解
    转载请出自出处： http://eksliang.iteye.com/blog/2106082 简介       sed 是一种在线编辑器，它一次处理一行内容。处理时，把当前处理的行存储在临时缓冲区中，称为“模式空间”（pattern space），接着用sed命令处理缓冲区中的内容，处理完成后，把缓冲区的内容送往屏幕。接着处理下一行，这样不断重复，直到文件末尾
  • Android应用程序获取系统权限 gqdy365 android
    引用 如何使Android应用程序获取系统权限         第一个方法简单点，不过需要在Android系统源码的环境下用make来编译：         1. 在应用程序的AndroidManifest.xml中的manifest节点
  • HoverTree开发日志之验证码 hvt .netC#asp.nethovertreewebform
    HoverTree是一个ASP.NET的开源CMS，目前包含文章系统，图库和留言板功能。代码完全开放，文章内容页生成了静态的HTM页面，留言板提供留言审核功能，文章可以发布HTML源代码，图片上传同时生成高品质缩略图。推出之后得到许多网友的支持，再此表示感谢！留言板不断收到许多有益留言，但同时也有不少广告，因此决定在提交留言页面增加验证码功能。ASP.NET验证码在网上找，如果不是很多，就是特别多
  • JSON API：用 JSON 构建 API 的标准指南中文版 justjavac json
    译文地址：https://github.com/justjavac/json-api-zh_CN 如果你和你的团队曾经争论过使用什么方式构建合理 JSON 响应格式， 那么 JSON API 就是你的 anti-bikeshedding 武器。 通过遵循共同的约定，可以提高开发效率，利用更普遍的工具，可以是你更加专注于开发重点：你的程序。 基于 JSON API 的客户端还能够充分利用缓存，
  • 数据结构随记_2 lx.asymmetric 数据结构笔记
    第三章 栈与队列 一．简答题 1. 在一个循环队列中，队首指针指向队首元素的  前一个    位置。  2.在具有n个单元的循环队列中，队满时共有  n-1  个元素。  3. 向栈中压入元素的操作是先  移动栈顶指针&n
  • Linux下的监控工具dstat 网络接口 linux
    1) 工具说明dstat是一个用来替换 vmstat,iostat netstat,nfsstat和ifstat这些命令的工具, 是一个全能系统信息统计工具. 与sysstat相比, dstat拥有一个彩色的界面, 在手动观察性能状况时, 数据比较显眼容易观察; 而且dstat支持即时刷新, 譬如输入dstat 3, 即每三秒收集一次, 但最新的数据都会每秒刷新显示. 和sysstat相同的是,
  • C 语言初级入门--二维数组和指针 1140566087 二维数组c/c++指针
    /* 二维数组的定义和二维数组元素的引用 二维数组的定义： 当数组中的每个元素带有两个下标时，称这样的数组为二维数组； (逻辑上把数组看成一个具有行和列的表格或一个矩阵); 语法： 类型名 数组名[常量表达式1][常量表达式2] 二维数组的引用： 引用二维数组元素时必须带有两个下标，引用形式如下： 例如： int a[3][4];  引用：
  • 10点睛Spring4.1-Application Event wiselyman application
    10.1 Application Event Spring使用Application Event给bean之间的消息通讯提供了手段 应按照如下部分实现bean之间的消息通讯 继承ApplicationEvent类实现自己的事件 实现继承ApplicationListener接口实现监听事件 使用ApplicationContext发布消息
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他