第十四周课程（1-12章节）

HTML 裸体

CSS   穿华丽衣服

Javascript 动起来

一 HTML （20个标签）

1.我们的浏览器是socket客户端

2.一套规则，浏览器认识的规则

3.开发者：

学习html规则

开发后台程序：

写html文件（充当模版的作用），

数据库获取数据，然后替换到html文件的指定位置（web框架）

4.本地测试：

找到文件路径，直接浏览器打开

pycharm打开测试

4.编写html文件

在整个html文件里面html标签只能有一个

doctype对应关系

类似html这种格式，都称作html标签  <html>abcd</html>

标签内部可以写属性<html lang="en" name="alex">

单行和多行注释：<!-- 注释的内容 -->

head标签里面其他标签都看不到，只有title标签在网址顶部能看到

5.标签分类

- 自闭和标签 ：建议后面加上/，比如 <br/>,   eg： <meta charset="UTF-8">

- 主动闭合标签  eg： <title>badboy</title>

6. head标签中

- <meta > 编码，跳转，刷新，关键字，描述， IE兼容

-title 标签

-<link/>

- <style/>

- <script >

7. body 标签:  标签内部字母大小写不区分

- 图标，空格&nbsp;    大于号&gt;      小于号&lt;

- p标签：段落
- br标签：换行

- h标签：

- span标签：

-----小总结----

所有标签分为：块极标签：div(白板），H系列（加大加粗），p标签（段落和段落之间有间距）

行内标签：span（白板）

标签之间可以嵌套

标签存在的意义：css操作，js操作起来方便

ps：chorme审查元素的使用（可以定位，查看样式）

- input系列

单行文本输入

input type='text     - name属性, value= “赵帆”，表示输入框内的默认值

input type='password'    -name属性

input type='submit'    - value='提交',提交按钮，表单

input type='button'     -value='登录'按钮

input type='radio'   -单选款 value，checked=checked表示默认勾选，name属性（name相同则互斥）

input type='radio'   -复选款 value，checked=checked表示默认勾选，name属性（批量获取数据）

input type=‘file’  -表示上传文件，但它依赖form表单的一个属性，及在form表单里输入enctype= "multipart/form-data", 这表示数据一点一点传给服务器

input type='reset'  -表示重置

<textarea>默认值<textarea/>  -name属性,表示多行文本输入

<select></select>                 -表示下拉框选择，name属性，内部option，value，提交到后台，size，multiple表示可以多选

总结：input系列，textarea和select标签都是可以提交到后台的

 <!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <title>Title</title>

 </head>

 <body>

       <input type="text">

       <input type="password">

       <input type="submit">

       <input type="button">

       <form enctype="multipart/form-data">

           <div>

               <select name="city" size="5">

                   <option value="1">北京</option>

                   <option value="2">上海</option>

                   <option value="3" selected="selected">杭州</option>

                   <option value="4">深圳</option>

               </select>

               <select name="city" multiple=multipe size="5">

                   <option value="1">北京</option>

                   <option value="2">上海</option>

                   <option value="3" selected="selected">杭州</option>

                   <option value="4">深圳</option>

               </select>

               <p>请选择性别</p>

               男：<input type="radio" name="same" value="1" checked="checked">

               女: <input type="radio" name="same" value="2">

               <p>请选择爱好</p>

               足球：<input type="checkbox" name="favor" name="1" checked="checked">

               篮球：<input type="checkbox" name="favor" name="2">

               台球：<input type="checkbox" name="favor" name="3">

               <p>上传文件</p>

               <input type="file" name="fname">

           <div/>

           <div>

               <input type="submit" value="提交">

               <input type="reset"  value="重置">

           <div/>

           <div>

               <textarea name="world">hello,world</textarea>

           </div>

       <form/>

 </body>

 </html>

二 CSS （颜色，位置。。。）

第一篇-Html标签中head标签，body标签中input系列，textarea和select标签的更多相关文章

  1. 第一篇 - bsp抓取python中文开发者社区中的所有高级教程

    工具:python3.6  pycharm 库:bs4 + urllib 第一步:读取html源码 from bs4 import BeautifulSoup import urllib.reques ...

  2. 第一篇 网站基础知识 第4章 Java中Socket的用法

    第4章 Java中Socket的用法 4.1 普通Socket的用法 Java中的网络通信是通过Socket实现的,Socket分为ServetSocket和Socket两大类,ServetSocke ...

  3. jQuery系列之操作select标签

    每次看完东西基本就忘了,现在决定写一下博客来记录,不知道效果咋样. 一.jQuery操作选择器 1.基本选择器 关于基本选择器,我就不用太多说了,包括了ID.类.标签等选择器. 2.层次选择器 我觉得 ...

  4. 前端开发【第一篇：HTML】

    HTML初识 1.什么是HTML HTML是英文Hyper Text Mark-up Language(超文本标记语言)的缩写,他是一种制作万维网页面标准语言(标记).相当于定义统一的一套规则,大家都 ...

  5. javaWeb技术第一篇之HTML

    <!-- 当前是最简的html --> <html> <!-- 告诉浏览器当前是一个html文档 最外面的标签. --> <head> <!--h ...

  6. select标签让文字垂直居中问题

    直接在select样式中添加:padding:npx 0; n的大小视select标签的高度而定.一般为8px左右.

  7. 微软BI 之SSRS 系列 - 如何实现报表标签的本地化 - 中文和英文的互换

    SSRS 中并没有直接提供本地化的配置方式,因此在 SSRS 中实现本地化,比如有英文标题还有可选的中文标题,就需要通过其它的方式来解决. 比如默认是这样的英文标题 - 但是本地中方用户可能比较喜欢看 ...

  8. HTML中的<select>标签如何设置默认选中的选项

    方法有两种. 第一种通过<select>的属性来设置选中项,此方法可以在动态语言如php在后台根据需要控制输出结果. 1 2 3 4 5 < select  id =  " ...

  9. 03_MyBatis基本查询，mapper文件的定义，测试代码的编写，resultMap配置返回值，sql片段配置，select标签标签中的内容介绍，配置使用二级缓存，使用别名的数据类型，条件查询ma

     1 PersonTestMapper.xml中的内容如下: <?xmlversion="1.0"encoding="UTF-8"?> < ...

随机推荐

  1. html标签详解（2）

    http标签详解 声明 1:这里的文字都是我从我自己csdn账号拷贝过来,是本人学习总结的结晶,所以请尊重本作品.2:如要要转载本文章,则要说明文字的出处.3:如有哪里不对欢迎指出. 在上一篇文章中主 ...

  2. sql server 索引阐述系列七 索引填充因子与碎片

    一.概述 索引填充因子作用:提供填充因子选项是为了优化索引数据存储和性能. 当创建或重新生成索引时,填充因子的值可确定每个叶级页上要填充数据的空间百分比,以便在每一页上保留一些剩余存储空间作为以后扩展 ...

  3. 支付宝PC端单笔支付同步回调session失效问题

    一次调用支付宝PC场景下单笔支付之后同步回调遇到的session失效问题记录 问题描述: 调用支付宝接口:alipay.trade.page.pay,该接口请求参数中有两个返回地址需要设置,retur ...

  4. tensorflow 1.12.0 gpu + python3.6.8 + win10 + GTX1060 + cuda9.0 + cudnn7.4 + vs2017）

    在安装tensorflow-gpu时,也看过不少的博客,讲得乱七八糟的,也不能这样说,只是每个人安装的环境或需求不一样,因此没有找到一个适合自己的教程去安装tensorflow-gpu版本.当然,入手 ...

  5. MySQL Router实现MySQL的读写分离

    1.简介 MySQL Router是MySQL官方提供的一个轻量级MySQL中间件,用于取代以前老版本的SQL proxy. 既然MySQL Router是一个数据库的中间件,那么MySQL Rout ...

  6. Python数值类型

    数值类型 python的数值类型包括常规的类型:整数(没有小数部分的数字).浮点数(通俗地说,就是有小数部分的数字)以及其它数值类型(复数.分数.有理数.无理数.集合.进制数等).除了十进制整数,还有 ...

  7. 小型音乐播放器插件APlayer.js的简单使用例子

      本篇博客将会给出一个小型音乐播放器插件APlayer.js的使用例子.关于APlayer.js的具体介绍和Github地址,可以参考: https://github.com/MoePlayer/A ...

  8. MVC学习之路（1） EF 增删查改合集

    首先再Model中创建一个类[WMBlogDB] public class WMBlogDB : DbContext { //连接字符串. public WMBlogDB() : base(" ...

  9. 5.QT-QString类

    Qt中的字符串类 介绍 采用Unicode编码  采用隐式共享技术,节省内存和不必要的数据拷贝 隐式共享介于浅拷贝和深拷贝之间,当两个string对象赋值时,会实现浅拷贝(共享一块内存),如果某个对象 ...

  10. Python_简单三级菜单制作

    一:制作要求 1.三级菜单 2.可依次选择进入各子菜单 3.所需新知识点:字典,列表 *本文通过三种方法完成,第一种:只使用循环,第二种:使用列表,第三种:使用字典 二:FlowChart流程图 与上 ...