下拉列表，文本域，复选框

<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">

    <title>MyGod</title>

</head>

<body>

   <form action="http://baidu.com" method="get">

          <input type="checkbox" id="a">

          <label for="a">sss</label>

          <label><input type="radio" value="2">男</label><br>

          <select name="xllb">

                <optgroup label="一">

                    <option> 1 </option>

                    <option> 2 </option>

                    <option> 3 </option>

                </optgroup>

          </select>

          <textarea rows="5" cols="10" placeholder="请输入文本"></textarea>

          <input type="submit" formaction="http://www.baidu.net">

   </form>

</body>

</html>

重写form的一些属性

<form action="http://baidu.com" method="get">

          <input type="submit" formaction="http://www.sina.com">

   </form>

output元素和进度条

<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">

    <title>MyGod</title>

</head>

<body>

   <form action="http://baidu.com" id="myform" oninput="num.value=parseInt(num1.value)+parseInt(num2.value)">

   <input type="number" id="num1">+

   <input type="number" id="num2">=

   <output id="num" for="num1 num2"></output><br>

   <!-- <progress value="30" max="100"><br> -->

   <meter max="100" min="0" value="30" high="80" low="20"></meter> <br>

   <meter max="100" min="0" value="10" high="80" low="20"></meter> <br>

   <meter max="100" min="0" value="90" high="80" low="20" optimum="60"></meter> <br>

   </form>

</body>

</html>

边框fieldset

<fieldset>

            <legend>用户注册</legend>

            账号: <input type="text">

            密码: <input type="password">

        </fieldset>

canvas画直线

<canvas id="mycanvas" width="500" height="300"></canvas>

    <script type="text/javascript">

        var canvas=document.getElementById('mycanvas');

        var context=canvas.getContext('2d');

        context.moveTo(0,0);

        context.lineTo(100,100);

        context.stroke();

    </script>

css样式

@charset='utf-8';

p{color: red}

h1{color: blue}

div{background: red; color: green}

调用css外部样式

<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">

    <title>MyGod</title>

    <link rel="stylesheet" type="text/css" href="style.css">

</head>

<body>

    <h1>Welcome</h1>

    <p>To My World</p>

    <div>How are you?</div>

</body>

</html>

样式的优先顺序：

设计者设计的样式>浏览器用户自定义的样式>浏览器自设的样式

内联样式>内部样式>外部样式

样式选择器

@charset='utf-8';

/**{color: blue} /*通用选择器*/

#a{background-color: green}/*id选择器*/

.b{background-color: cyan}/*类选择器*/

h1.b{background-color: black}

input[value][id]{background-color: orange}

input[id="but"][value]{background-color: yellow}

html基础知识总结2的更多相关文章

  1. .NET面试题系列[1] - .NET框架基础知识(1)

    很明显,CLS是CTS的一个子集,而且是最小的子集. - 张子阳 .NET框架基础知识(1) 参考资料: http://www.tracefact.net/CLR-and-Framework/DotN ...

  2. RabbitMQ基础知识

    RabbitMQ基础知识 一.背景 RabbitMQ是一个由erlang开发的AMQP(Advanced Message Queue )的开源实现.AMQP 的出现其实也是应了广大人民群众的需求,虽然 ...

  3. Java基础知识（壹）

    写在前面的话 这篇博客,是很早之前自己的学习Java基础知识的,所记录的内容,仅仅是当时学习的一个总结随笔.现在分享出来,希望能帮助大家,如有不足的,希望大家支出. 后续会继续分享基础知识手记.希望能 ...

  4. selenium自动化基础知识

    什么是自动化测试? 自动化测试分为:功能自动化和性能自动化 功能自动化即使用计算机通过编码的方式来替代手工测试,完成一些重复性比较高的测试,解放测试人员的测试压力.同时,如果系统有不份模块更改后,只要 ...

  5. [SQL] SQL 基础知识梳理（一）- 数据库与 SQL

    SQL 基础知识梳理(一)- 数据库与 SQL [博主]反骨仔 [原文地址]http://www.cnblogs.com/liqingwen/p/5902856.html 目录 What's 数据库 ...

  6. [SQL] SQL 基础知识梳理（二） - 查询基础

    SQL 基础知识梳理(二) - 查询基础 [博主]反骨仔 [原文]http://www.cnblogs.com/liqingwen/p/5904824.html 序 这是<SQL 基础知识梳理( ...

  7. [SQL] SQL 基础知识梳理（三） - 聚合和排序

    SQL 基础知识梳理(三) - 聚合和排序 [博主]反骨仔 [原文]http://www.cnblogs.com/liqingwen/p/5926689.html 序 这是<SQL 基础知识梳理 ...

  8. [SQL] SQL 基础知识梳理（四） - 数据更新

    SQL 基础知识梳理(四) - 数据更新 [博主]反骨仔 [原文]http://www.cnblogs.com/liqingwen/p/5929786.html 序 这是<SQL 基础知识梳理( ...

  9. [SQL] SQL 基础知识梳理（五） - 复杂查询

    SQL 基础知识梳理(五) - 复杂查询 [博主]反骨仔 [原文]http://www.cnblogs.com/liqingwen/p/5939796.html 序 这是<SQL 基础知识梳理( ...

  10. APP测试入门篇之APP基础知识(001)

    前言        最近两月比较多的事情混杂在一起,静不下心来写点东西,月初想发表一遍接口测试的总结,或者APP测试相关的内容,一晃就月底了,总结提炼一时半会也整不完.放几个早年总结内部培训PPT出来 ...

随机推荐

  1. 与Scheme共舞

    发表在<程序猿>2007年7月刊上.不log上写帖子不用考虑版面限制,所以这里的帖子比发表的啰嗦点.赵健平编辑,Jacky,和刘未鹏都给了我非常多帮助,在这里一并谢了.免费的Scheme实 ...

  2. Android Studio Gradle 缓存目录设置

    ======================================================== 笔者:qiujuer 博客:blog.csdn.net/qiujuer 站点:www. ...

  3. jsp if else c标签 总结

    JSTL标签使用方法 keyword:JSTL标签.<c:choose>.<c:forEach>.<c:forTokens>.<c:if>.<c: ...

  4. apktool的下载地址

    googlecode将要关闭,代码转移到以下网址 http://ibotpeaches.github.io/Apktool/

  5. oracle手动删除数据库

    有时候,无法使用图形界面时,我们需要手动删除数据库,具体操作步骤如下:一.手动删除文件系统数据库   1.停止监听,防止有新的连接产生,同时,在数据库配置了em的,也需要停止 $ lsnrctl st ...

  6. hdu 5108

    //题意是给一个数N,然后让你求M,使得N/M为素数,并且M的值最小 //思路呢,大概有两种,一个是遍历素数求解的,不过数据太大不现实 //另外一种就是质因数求解,for循环是遍历质因数,然后whil ...

  7. Spring 3.0就这么简单读书笔记

    一般情况下,spring容器中的大部分Bean都是单实例的,所以一般无须通过@Repository.@Service.@Component等注解的value属性为Bean指定名称,也无须使用@Qual ...

  8. 破解Windows Server 2003只允许3个用户远程登陆

    导读:WIN2003在使用远程桌面登录的时候,一台机器默认情况下只允许3个用户同时登录. 这很不方便.我们修改WIN2003远程桌面的连接数,可以设置3个以上用户远程桌面. 1.启动终端服务:在&qu ...

  9. MySQL的truncate table 和source 命令

    1. truncate table XXX     在测试时,我很讨厌某表的主键一直自增长下去,总觉得从1开始最舒服,^_^,truncate table 就可以帮我,相比delete from 来说 ...

  10. restful风格的webservice开发之概念准备篇

    理解restful:什么是rest,rest是Representational State Transfer的缩写,翻译过来就是“表现层状态转化”.这里有点不准确,其实rest省略了主语表现层指的是资 ...