一 web掐断三大核心技术
HTML:负责网页的结构
CSS:负责网页的美化
JS:负责网页的行为
二 工具的使用
改变HBuilder文字的大小:
工具-视觉主题设置-大小22-确定
三 html简介
中文定义:超文本标记语言
新建一个html网页:
1.新建“代码”文件夹
2.拖拽文件夹到HBuilder的项目管理器中
3.在文件夹里面新建一个html文件
四 html骨架标签
骨架标签:新建的时候默认生成的那些标签
meta标签可以设置网页的字符集(utf8 国际编码)
title标签设置网页的标题
body标签设置网页的主体内容部分
五 文章标题标签
h1到h6分六级,依次减小效果,每个标题都是独占一行空间;
注意:不能自己造标签,因为无法正常运行
六 空格和回车
一个空格:
一个换行,一个回车:
注意:因为换行有很多种格式,测试细节的时候,以浏览器最终运行效果为准
七 p标签和标签语义化
p(passage)负责放文章段落的;
语义化:在合适地方使用合理的标签,就叫满足标签语义化。
八 代码注释
程序员给自己代码的提醒文字,浏览器不会直接显示;
快捷键:Ctrl+? 再按一次会取消注释
测试要注意:项目上线之前,要求程序员删除注释的内容,目的是加快网页的加载速度。
九 文字相关的标签
b和strong都用来代表加粗,strong代表强调的语义;
i和em都可以实现倾斜,em代表强调;
s和del都可以实现删除线效果,del主流
十 img标签
插入图片标签;
键值对,key和value,属性名和属性值
身高=“180”
年龄=“17”
体重=“150”
步骤:
1.先把图片准备好,复制到与html同一级别的文件夹下
2.src(source)代表资源,后面写图片名称
3.width宽度,height高度,
只设置其中一个,图片会按照当前比例尺寸来调整,如果都设置,才会按照宽和高来调整。
4.title为鼠标悬停提示文字
5.alt 后面的内容只有当当前图片资源加载不出来的时候才会显示,或者读给网页阅读器听
十一 超链接标签
超链接:点击之后实现页面内容的跳转
1.打开线上的网站需要加上http协议
href属性对应的属性值应该带上http协议
2.如果想要百度页面在新窗口打开
需要加一个target=“_blank”
3.如果想打开本地页面,需要把想要打开的文件和当前文件放在同一个文件夹里
在href里面写上想要打开的文件即可
4.空连接
暂时不知道点击之后跳转到哪里,使用空链接占位,当知道具体要跳转的位置后,再回来更改即可
注:测试工作的时候,如果发现程序员使用#来表示返回顶部效果,一定要提示程序员,要用动画效果实现,用户体验才更好。