Html基础 day1
一、 工具(webstorm)
1.创建项目:文件-新项目-选择路径-create
2.创建文件:项目名称右键-新建-css/js/html
3运行页面:点击右键-open-选择已安装的浏览器
4 调整字体大小:文件-设置-编辑器-颜色和字体-font-另存为
5查找:ctrl+f
二、html(超文本标记语言)
1命名规则
文件命名规则:用英文,不用中文 名称全部用小写英文字母、数字、下划线的组合,其中不得包含汉字、空格和特殊字符;必须以英文字母开头
基本结构
2语法
双标签:<标签名 属性:属性值></标签名> eg<table border="1"></table>
单标签:<标签名 属性:属性值/>eg<img src="图片地址“/>
三、常用标签
1标题标签
<h1></h1>...<h6></h6>
h1最大,h6最小
2段落
<p> </p>
3空格
 
1) 2个英文空格=1个中文字符
2) 注意:与当前字体,字号有关,使用时需微调
4 换行<br/>
5加粗
<b></b>
<strong></srrong>
注意:以后使用strong,strong更具 语义化
6倾斜
<i></i>
<em></em>
注意:以后使用em,em更具语义化
7水平线
<hr/>
8 图片标签
<img src="图片地址”/>
相对路径 返回上一级:../
src="../image/im.
9超链接
<a href="要链接的地址“></a>
10列表标签
1) 无序列表
<ul><li></li>...</ul>
2)有序列表
<ol><li></li>...</ol>
3) 自定义列表
<dl><dt></dt><dd></dd>...</dl>
11表格标签
1)<table><tr><td></td></tr>。。。</table>
2) tr行,td单元格
3)技巧:多少行就是多少个tr,
合并:
合并行
rowspan
合并列
cowlspan
注意:tr必须包含在table当中,td必须包含在tr中,内容必须包含在td中
扩展
无内容单元格显示、隐藏
empty-cells:show/hide;
合并相邻单元格边框
border-collapse:separate(边框分开)/collapse(边框合并)
三、 注释
html:<!--注释内容-->
注意: 注释要有意义
css:/* */
js:单行://,多行:/* */.
一、 工具(webstorm)
1.创建项目:文件-新项目-选择路径-create
2.创建文件:项目名称右键-新建-css/js/html
3运行页面:点击右键-open-选择已安装的浏览器
4 调整字体大小:文件-设置-编辑器-颜色和字体-font-另存为
5查找:ctrl+f
二、html(超文本标记语言)
1命名规则
文件命名规则:用英文,不用中文 名称全部用小写英文字母、数字、下划线的组合,其中不得包含汉字、空格和特殊字符;必须以英文字母开头
基本结构
2语法
双标签:<标签名 属性:属性值></标签名> eg<table border="1"></table>
单标签:<标签名 属性:属性值/>eg<img src="图片地址“/>
三、常用标签
1标题标签
<h1></h1>...<h6></h6>
h1最大,h6最小
2段落
<p> </p>
3空格
 
1) 2个英文空格=1个中文字符
2) 注意:与当前字体,字号有关,使用时需微调
4 换行<br/>
5加粗
<b></b>
<strong></srrong>
注意:以后使用strong,strong更具 语义化
6倾斜
<i></i>
<em></em>
注意:以后使用em,em更具语义化
7水平线
<hr/>
8 图片标签
<img src="图片地址”/>
相对路径 返回上一级:../
src="../image/im.
9超链接
<a href="要链接的地址“></a>
10列表标签
1) 无序列表
<ul><li></li>...</ul>
2)有序列表
<ol><li></li>...</ol>
3) 自定义列表
<dl><dt></dt><dd></dd>...</dl>
11表格标签
1)<table><tr><td></td></tr>。。。</table>
2) tr行,td单元格
3)技巧:多少行就是多少个tr,
合并:
合并行
rowspan
合并列
cowlspan
注意:tr必须包含在table当中,td必须包含在tr中,内容必须包含在td中
扩展
无内容单元格显示、隐藏
empty-cells:show/hide;
合并相邻单元格边框
border-collapse:separate(边框分开)/collapse(边框合并)
三、 注释
html:<!--注释内容-->
注意: 注释要有意义
css:/* */
js:单行://,多行:/* */.