A股上市公司传智教育(股票代码 003032)旗下技术交流社区北京昌平校区

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

臾期

初级黑马

  • 黑马币:

  • 帖子:

  • 精华:

© 臾期 初级黑马   /  2018-7-19 17:01  /  1060 人查看  /  6 人回复  /   0 人收藏 转载请遵从CC协议 禁止商业使用本文

HTML
html控制文本内容,css控制网页样式
IDE:集成开发环境
span标签 div标签 成对的 大部分标签是重复的
input标签 单独出现的
html 超文本标记语言 超文本指的是超链接
扩展名 html或者htm 标记指的是标签
body标签 网页显示内容
head标签的主要作用:网页设置 资源引用
标签里面可以添加属性
meta标签 单标签

浏览器的渲染功能将html文件转换成界面
浏览器能够识别html文件中的标签

html5新增了很多标签

html文档规范
1.所有的标签必须小写
2.所有的属性必须加引号
3.标签应该闭合(<br />单独标签的规范写法:标签后面加、,成对标签应该成对出现)
4.img必须要加alt属性(对这个图片的描述)(很重要)
快速创建html文本文件  !加tap

html注释
<!- -  - ->
快捷前ctrl+/

标签的分类
块元素(行元素)
内联元素(行内元素)

html标题
<h1~h6> (块级标签)
文字大小和样式间距
自动换行
搜索引擎会根据标题将网页的结构和内容编制索引

段落标签
<p>
编辑时的样式和网页上显示的效果是不一样的
<br />强制换行

html字符实体
空格的字符实体&nbsp;                        alt+z切换自动换行vscode
显示<>
&gt;表示一个>
&lt;表示一个<

html块,含样式的标签
html块
div标签 块元素 表示一块内容,没有具体的语义
span标签 行内元素,表示一行中的一小段内容,没有具体语义
div标签之前没有空行 p标签之前有空行
Span给一段中的一小段内容加样式

含样式和语义的标签
em标签 行内元素,表示语气中的强调词
i标签 行内元素 原本没有语义,w3c添加了语义,表示专业词汇
em和i标签的语义是不同的
b标签 行内元素 原本没有语义,w3c添加了语义,表示文档中的关键字或者产品名
strong标签 行内元素,表示非常重要的内容 强调一段话用的
语义化的标签:
布局的时候使用语义化的标签,搜索引擎在爬网时能识别这些标签,理解文档的结构,方便网站的收录

a标签 超链接标签 行内元素
添加链接只要在href属性里添加就可以
# 返回到最上面 或者 是占位符
文件,链接,跳转位置
target属性一般_blank跳转的内容在另一个网页打开

img图片标签
src属性添加要展示的图片地址
Alt属性的作用:图片加载失败,显示提示信息
                       制作无障碍网页,方便盲人的读屏
                       搜索引擎会根据标题将网页的结构和内容编制索引

html图像,绝对路径和相对路径
html图像

html无序列表
ul 标签  无序
dl 标签 定义列表

特殊的标签
删除标签:del
下划线标签:ins或者(u)

Html整体是由标签组成的,各个标签的功能很多都是重复的
标签整体分为:块级标签和行内标签
块级标签可以设置宽高值,独占一行
行内标签自动设置宽高值,一行内可以有多个
一般来说,块级元素可以包含行内元素,行内元素不能包含块级元素
p标签里不能嵌套div标签

标签语义化



6 个回复

倒序浏览
回复 使用道具 举报
回复 使用道具 举报
优秀,加油加油!
回复 使用道具 举报
回复 使用道具 举报
回复 使用道具 举报
回复 使用道具 举报
您需要登录后才可以回帖 登录 | 加入黑马