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,但是仅仅了解这样还不行,遇 ...
随机推荐
- fiddler 安装证书问题,和安装完后,浏览器无法访问问题
安装证书问题 https://blog.csdn.net/l1336037686/article/details/78322014 浏览器无法访问问题 https://blog.csdn.net/u0 ...
- ES6的字符串和数值的扩展
字符串扩展 对于处理大于两个字节(大于0xffff)的字符,let str =’\u{20bb7}abc’ ES5中的遍历 for(let i=0;i<str.length;i++){ con ...
- python练习题-day17
1.计算n!,例如n=3(计算321=6), 求10! 2.已知一个数列:1.1.2.3.5.8.13.....的规律为从3开始的每一项都等于其前两项的和,这是斐波那契数列.求满足规律的100以内的所 ...
- turtlebot3 ubuntu mate 实现vnc连接
tuutlebot3 ubuntu mate 实现vnc连接 摘要: 在turtlebot3 安装的nbuntu mate系统实验过. 实现内容 x11vnc 安装 x11vnc自动启动 vnc分辩率 ...
- weblogic使用wlst脚本实现自动部署
创建weblogic的server和cluster ip="10.20.0.2" nwport=8001 wwport=9001 nwlist=[ ('wtdsrwnw','Clu ...
- flask shell命令
在flask项目目录下,使用pipenv shell激活flask虚拟环境后,调用flask shell能够使用虚拟环境的python解释器进入交互式环境,并且工作目录还保留在flask项目目录. f ...
- angular4脚手架搭建
Angular4.X安装,创建 1.安装最新的nodejs(node -v ,npm -v) 2.新建文件夹(右键git bash here)npm install -g @angular/cli 3 ...
- pwn学习日记Day3 基础知识积累
知识杂项 msfVENOM:Msfvenom是msf框架配套的攻击载荷生成器. payload:有效载荷. payload:目标系统上渗透成功后执行的代码. Metasploit:一款开源的安全漏洞检 ...
- 《linux就该这么学》第十三节课:第11章和第12章,vsftpd服务与samba和nfs服务
第十一章 (借鉴请改动) 11.1.文件传输协议 FTP文件穿数协议,端口20用于数据传输,21端口用于传输相关FTP命令 ftp协议的两种工作模式: 主动模式:ftp向客户端发起 被动模式(默认): ...
- nginx----------前端写了一套带有vue路由的的功能。放到nginx配置的目录下以后,刷新会报404未找到。
1. 这是根据实际情况来写的. location /h5/activity/wechat/ { index index.html index.htm index.php; ...