html和css基础

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了html和css基础相关的知识,希望对你有一定的参考价值。

1,html 全称
Hyper Text Markup Language(超文本标记语言)
扩展XML:Extendsible Markup Language(可扩展性标记语言)

2,CSS是一种表现样式

3,js则是一种行为,控制网页的行为。

 

编写html 文档的注意点
01.所有标签字母均小写。
02.有开始就要有闭合标签
03.每个层次的标签有一定程度的缩进。
注意:如果发现body 内书写了内容,用浏览器打开后发现没有内容,那么
就需要检查下title 标签有没有闭合。

标签

01.h 标签:从h1 到h6 字体逐渐减小。
效果:自身加粗,并且可以控制字号。
02.p 标签:和其他的内容行之间有一个空行。
03.br 换行标签:是自身闭合标签。<br/>
04.hr 水平线标签,是自身闭合标签。
05.strong(加粗)、06.em(倾斜)
07.特殊符号:所有的特殊符号都是包括在&;中
空格:&nbsp;
大于号:&gt;
小于号:&lt;
双引号:&quot;
版权符号:&copy;

08.图片标签<img src=”.jpg” alt=“。。” />


10.超链接
分类:页面间链接,锚链接,功能性链接。

11.页面间链接
<a href=”http://www.baidu.com”>去百度</a>

12.锚链接
同页面间锚链接
分两步:第一步:在页面目标位置设置一个锚记。<a name=”star”><img src=”01.jpg”
/></a>
第二步:在另一处创建出一个超链接:<a href=”#star”>去看明星的隐私信
息吧</a>
02.跨页面的锚链接
功能性链接:
<a href=”mailto:[email protected]”>站长信箱</a>
<a href="tencent://message/?uin=QQ">打开QQ</a>

13.列表
001.无序列表:
<ul>
<li></li>
</ul>
002.有序列表
<ol>
<li></li>
</ol>
003.定义描述标签:应用场景:在图文混编的情况下使用
<dl>
<dt>放置图片</dt>
<dd></dd>

表格
<html>
<head>
<title>表格</title>
</head>
<body>
<table border="1px">
<tr>
<td>北京</td>
<td>上海</td>
<td>广州</td>
</tr>
<tr>
<td>北京</td>
<td>上海</td>
<td>广州</td>
</tr>
<tr>
<td>北京</td>
<td>上海</td>
<td>广州</td>
</tr>
</table>
</body>
</html>
重点:表格的跨行跨列
步骤:1、有几行几列?
解析:3 行两列
2.该跨行的跨行(rospan),该跨列的跨列(cospan)
3.核心原则:跨行和跨列只能出现在td 中
一定要注意的是:所有的跨行和跨列操作都出现在td 中。

以上是关于html和css基础的主要内容,如果未能解决你的问题,请参考以下文章

css有用的代码片段

[vscode]--HTML代码片段(基础版,reactvuejquery)

拥有的50个CSS代码片段(上)

VSCode自定义代码片段——CSS动画

VSCode自定义代码片段7——CSS动画

VSCode自定义代码片段7——CSS动画