博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
HTML基础
阅读量:4654 次
发布时间:2019-06-09

本文共 2570 字,大约阅读时间需要 8 分钟。

HTML是超文本标记语言,是一门标记语言,是一套标记标签,HTML使用标签来描述网页

1、HTML基本结构及书写规范

HTML书写规范 1.名字用小写字母 2.以英文开头,可以包含英文字母,数字,_,-,不能使用中文 3.驼峰命名     className  第二个单词首字母大写 4.id命名     id只能有一个名字,而且在页面中相同的名字只能出现一次,相当于身份证号码一样 5.class命名     class可以出现多次,而且相同的名字可以有多个,相当于人名一样 标签名+tab:自动补全命令

2、常用的HTML标签(元素)

①标题标签   (独占一行,一般在文章的开头)

   <h1>  </h1>...... <h6> </h6>

  一个页面h1标签一般只出现一次

②段落标签   (段落之间空一行)

  <p> </p>

③加粗标签    (字体加粗)

  <b></b>  只是物理加粗

  <strong> </strong> 不仅加粗,还有利于seo搜索

④斜体标签 (字体倾斜)

  <i> </i>    只是物理斜体

  <em> </em>    不仅斜体,还有利于SEO搜索

⑤换行标签(单标签)

  <br> 或<br/>  文档内容换行

⑥水平线标签(单标签)

  <hr>      在文档中添加一条水平线

⑦特殊符号

  &gt;      大于号

  &lt;     小于号

  &nbsp;  空格符号(连续多个只空一位)

  &emsp;   空位符号

  &amp;  &字符

  &copy;  版权符号

⑧a标签 (链接)

 刷新当前页面   死链接
 锚点(跳转到指定name或id的位置)

⑨图片标签 (单标签)默认图片大小,宽度和高度只指定一个值时,会等比缩放

图片描述,用于seo的搜索

⑩列表

  无序列表

 
  •  

  有序列表 

  自定义列表 

 
列表标题
 

⑪行内元素和块级元素(display:block(块级元素),inline(行内元素),inline-block(行内块级),none(隐藏))

  1、块级元素div display:block;

    可以包含任何块和行内元素独占一行,支持设置宽高

    如果没有设置宽高,高度由内容撑开,宽度默认浏览器宽度

    没有内容,在网页上肉眼看不到东西,但是审查元素,宽度是浏览器宽度,高度0

  2、行内(内联)元素span display:inline;

     可以和其他行内元素位于同一行

    行内元素不要包块级元素不支持设置宽高

    内容撑开宽高

  3、行内块元素 display:inline-block;

    块级元素可以横排展示

    行内元素可以设置宽高

    元素既能设置宽高 也能排在一排

  4、display:none

   隐藏元素,包括他的子标签,在页面中不占位置,等同于消失了,可以设置特定条件显示出来

  <div></div>(块级)

  <span></span>(行内)

⑫table表格(boder-collapse:collapse合并边框)<table border="边框">   

   <thead(表头)>

       
    
     

⑬form表单(用于前后台交互)

    
Title
action 指定当前提交表单向何处发送表单数据 method 默认get post autocomplete自动完成,on输入框会提示 off输入框不会提示 账号:
密码:
required为必填字段 文件上传:
隐藏:
单选框:
男(disabled时不能被选中)
(使用label标签时点击包含在标签内的文字也能选中,提高用户体验)
多选框:
兴趣
唱歌
跳舞
看书
游戏
disabled 禁止选 checked 默认选中
文本域:
提交
重置

 

转载于:https://www.cnblogs.com/wangwei13631476567/p/9158337.html

你可能感兴趣的文章
C语言-06复杂数据类型-01数组
查看>>
vue 图片预览插件
查看>>
深入解析:分布式系统的事务处理经典问题及模型
查看>>
python的2种字符串格式化输出
查看>>
Netsharp快速入门(之14) 销售管理(报表A 热销滞销品统计)
查看>>
配置 SQL Server Email 发送以及 Job 的 Notification通知功能
查看>>
Makefile 工程管理
查看>>
笔记本键盘失灵怎么办? 笔记本电脑按键失灵的一般解决办法
查看>>
寻找最大的数
查看>>
【转】java中float与byte[]的互转 -- 不错
查看>>
sockaddr和sockaddr_in的区别
查看>>
基础练习1
查看>>
左旋转字符串
查看>>
第二次C语言实验报告
查看>>
XPath轴
查看>>
Struts2的优点与Struts1的区别:
查看>>
5-29 删除字符串中的子串
查看>>
webdriver模拟鼠标操作
查看>>
Spring cloud 基础
查看>>
游戏开发Unity渲染场景光照性能优化 ShaderLOD
查看>>