Bigger-Mai 养成计划,前端基础学习之HTML
HTML 超文本标记语言(Hyper Text Markup Language)
1、一套规则,浏览器认识的规则。
2、开发者:
学习Html规则
开发后台程序:
- 写Html文件(充当模板的作用)@@@@
- 数据库获取数据,然后替换到html文件的指定位置(web框架)
3、本地测试
- 找到文件路径,直接浏览器打开
- pycharm打开测试
4.编写Html文件
- doctype对应关系
- html标签,标签内部可以写属性
- 注释: <!-- 注释的内容 -->
5、标签分类
- 自闭合标签
<meta charset="UTF-8">
- 主动闭合标签
title>老男孩</title>
6、head标签中
- <meta -> 编码,跳转,刷新,关键字,描述,IE兼容
<meta http-equiv="X-UA-Compatible" content="IE=IE9;IE=IE8;" />
- title标签
- <link /> 搞图标,欠
- <style />欠
- <script> 欠
7、body标签
- 图标, > <
- p标签,段落
- br,换行
- 产生粗体字的 HTML 标签 <b>
- 产生斜体字的 HTML 标签 <i>
- hr 标签定义水平线
======== 小总结 =====
所有标签分为:
块级标签: div(白板),H系列(加大加粗),p标签(段落和段落之间有间距)
行内标签: span(白板)
标签之间可以嵌套
标签存在的意义,css操作,js操作
ps:chorme审查元素的使用
- 定位
- 查看样式
- h系列
- div
- span
- input系列 + form标签
input type='text' - name属性,value="赵凡"
input type='password' - name属性,value="赵凡"
input type='submit' - value='提交' 提交按钮,表单
input type='button' - value='登录' 按钮
input type='radio' - 单选框 value,checked="checked",name属性(name相同则互斥)
input type='checkbox' - 复选框 value, checked="checked",name属性(批量获取数据)
input type='file' - 依赖form表单的一个属性 enctype="multipart/form-data"
input type='rest' - 重置
<textarea >默认值</textarea> - name属性
-select标签 - name,内部option value, 提交到后台,size,multiple
- a标签
- 跳转
- 锚 href='#某个标签的ID' 标签的ID不允许重复
- 制作电子邮件链接 <a href="mailto:xxx@yyy">
- img
src 规定显示图片的URL
alt 规定图片的替代文本
title
- 列表
ul 产生圆点符号开头的列表
li
ol 产生数字符号开头的列表
li
dl 产生分级的列表
dt
dd
- 表格
table
thead
tr
th
tbody
tr
td
colspan = 'num'合并行
rowspan = 'num'合并列
20个标签
Bigger-Mai 养成计划,前端基础学习之HTML的更多相关文章
- web前端基础学习路线
1.HTML和CSS的基础知识,完成网页的初步设计 2.JavaScript基础知识和DOM.BOM的学习 3.前端基础框架:CSS框架Bootstrap.JavaScript框架jquery的熟悉使 ...
- Bigger-Mai 养成计划,前端基础学习之CSS
在标签上设置style属性: background-color: #2459a2; height: 48px; ... 编写css样式: 1. 标签的style属性 2. 写在head里面 style ...
- Anibei前端基础学习
html.html5.CSS2.CSS3.JQuery.Vue.js学习,后端程序媛开始学习前端开发啦.
- Vue前端基础学习
vue-cli vue-cli 官方提供的一个脚手架(预先定义好的目录结构及基础代码,咱们在创建Maven项目的时可以选择创建一个骨架项目,这个骨架项目就是脚手架),用于快速生成一个vue项目模板 主 ...
- Web前端基础学习-1
HTML5/CSS简介 首先来说一说什么是HTML5,HTML5可以认为是字面上的意义,也就是HTML的第五代产品,当然从另一个角度来说它是一种新的富客户端解决方案. HTML5 将成为 HTML.X ...
- Web前端基础学习-2
盒子模型 在页面中,我们将所有的元素全部看做是一个盒子,页面布局就是将大大小小不同的盒子堆砌在一起,而一个盒子由以下几部分组成: padding:内边距,内容到边框的距离: margin:外边距,其他 ...
- Web前端基础学习-3
bfc(block formatting context) 块级格式化上下文 生成bfc的方式: 1.根元素: 2.float属性不为none(脱离文档流): 3.position为absolute或 ...
- Web前端开发工程师养成计划【转载】
Web前端开发工程师养成计划(入门篇) 最原始的忠告:这个世界上有想法的人很多,但是有想法又能实现它的人太少! 首先要感谢伟大的Web2.0概念.产品概念.用户体验概念.jQuery插件,是它们在中国 ...
- 高手养成计划基础篇-Linux第二季
高手养成计划基础篇-Linux第二季 本文来源:i春秋社区-分享你的技术,为安全加点温度 前言 前面我们学习了文件处理命令和文件搜索命令,简单的了解了一下Linux,但是仅仅了解这样还不行,遇 ...
随机推荐
- 软件工程第二次作业-VSTS单元测试
一.选择开发工具 开发工具选择 Visual studio 2017 社区版,开发语言为C 由于之前已经安装完毕,所以不上传安装过程,主界面如下: 二.练习自动单元测试 使用的测试工具是VSTS,具体 ...
- 在VM虚拟机中安装Centos操作系统
首先我们要下载 Centos https://www.centos.org/ 这个是Centos官方 最新版本 7 https://www.centos.org/download/ 提供有 DVD安 ...
- Timestamp “时间戳” - 术语
A timestamp is a sequence of characters or encoded information identifying when a certain event occu ...
- ES6的Proxy和Reflect
Proxy 有一个原始的数据对象,通过代理出来一个新的对象,用户操作的是这个新的对象 { let obj ={ time:'2018-01-01', name:'lx' , _r:123 } let ...
- Nginx 安装后 相关错误解决
1,安装 https://blog.csdn.net/wxyjuly/article/details/79443432 nobody 改为了 www /configure --user=www --g ...
- Python加密保护-对可执行的exe进行保护
Python 是一种面向对象的解释型计算机程序设计语言,Python 语言写的程序不需要编译成二进制代码,可以直接从源代码运行程序. 在计算机内部,Python解释器把源代码转换成称为字节的中间形式, ...
- angular开发手机网页小记
禁用滑动事件,阻止触发浏览器翻页行为 <html lang="en" style="height:100%" ontouchmove="(f ...
- 混合开发使用Chrome Inspect调试WebView预览手机界面和定位元素
使用Chrome Inspect调试混合应用可以帮助我们排查问题.例如定位元素,快速修改CSS样式并实时查看效果.其实微信开发也是一种混合开发模式,微信可以看做一个原生的Android App搭配了一 ...
- 自动化运维工具——ansile详解
自动化运维工具——ansible详解(一) 目录 ansible 简介 ansible 是什么? ansible 特点 ansible 架构图 ansible 任务执行 ansible 任务执行模式 ...
- 【Maven Jenkins】No resource to compile 还有多少坑要踩。。。LongTimeNoSee
[INFO] --- maven-compiler-plugin:3.1:compile (default-compile) @ toptown-webservice-vcrs ---[INFO] N ...