HTML&CSS学习总结

最新推荐文章于 2022-07-10 06:06:05 发布
最新推荐文章于 2022-07-10 06:06:05 发布
阅读量343 收藏 1
点赞数
CC 4.0 BY-SA版权
文章标签： html css 学习
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/molongqishi/article/details/125472087

1、什么是HTML？

        HTML的全称为超文本标记语言（Hyper Text Markup Language），是一种标记语言。它包括一系列标签．通过这些标签可以将网络上的文档格式统一，使分散的Internet资源连接为一个逻辑整体。HTML文本是由HTML命令组成的描述性文本，HTML命令可以说明文字，图形、动画、声音、表格、链接等。

        HTML是由Web的发明者 Tim Berners-Lee和同事 Daniel W. Connolly于1990年创立的一种标记语言，它是标准通用化标记语言SGML的应用。使用HTML，将所需要表达的信息按某种规则写成HTML文件，通过专用的浏览器来识别，并将这些HTML文件“翻译”成可以识别的信息，即我们所见到的网页。

2、编辑工具

        基本文本、文档编辑软件：使用微软自带的记事本或写字板都可以编写，当然，如果你用WPS或Word来编写也可以，不过保存时请使用.htm或.html作为扩展名，这样就方便浏览器认出直接解释执行了。

        半所见即所得软件，如：FCK-Editer、E-webediter等在线网页编辑器；Sublime Text代码编辑器（由Jon Skinner开发，Sublime Text2收费但可以无限期试用）。

        所见即所得软件，使用最广泛的编辑器，完全可以一点不懂HTML的知识就可以做出网页，如：AMAYA（出品单位：万维网联盟）；FRONTPAGE（出品单位：微软）；Dreamweaver（出品单位Adobe）。Microsoft Visual Studio（出品公司：微软；目前使用）：其中所见即所得软件与半所见即所得的软件相比，开发速度更快，效率更高，且直观的表现更强。任何地方进行修改只需要刷新即可显示。缺点是生成的代码结构复杂，不利于大型网站的多人协作和精准定位等高级功能的实现。

3、基本框架：

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
</body>

</html>

标记符<html>：说明该文件是用超文本标记语言来描述的，它是文件的开头，而</html>则表示该文件的结尾，它们是超文本标记语言文件的开始标记和结尾标记。(lang(uage)=”en(glish)”)

<head></head>：这2个标记符分别表示头部信息的开始和结尾。头部中包含的标记是页面的标题、序言、说明等内容，它本身不作为内容来显示，但影响网页显示的效果。

主题内容：

<body></body>；，网页中显示的实际内容均包含在这2个正文标记符之间。正文标记符又称为实体标记。

网页中几乎所有的内容都写在了body中。同时，为了满足开发人员的需求，我们还可以在body中写入很多的标签来帮助我们的开发，常见的有：

<div></div>: 一个容器，里面可以装很多的东西

代码：这里相当于是最简单的一个html页面了

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <div>1234</div>
</body>

</html>

界面：

我们可以看到，在左上角显示出了‘1234’，这正是我们在代码中写的东西。

4、标签：

构成：由一对尖括号<>和标签名构成，分为起始标签和结束标签两种，两者的标签名相同，只是结束标签的多加了‘/’，同时需要注意，有些标签是可以不需要加结束标签的。

常用标签：

<title></title>: 网页名称

<link></link>&<style></style>:常用于CSS

script标签：脚本编写

meta标签：元信息

div&span标签：用于布局，是没有语义的；

标题标签：<h1></h1>，此外还有其余的2~6级的标题，从1~6，标题中字体的大小依次减小；

段落标签：<p></p>，顾名思义，这个标签里面放的是一段文字；

换行标签：<br>；

由于接下来的标签很多都会涉及到标签属性，所以说明一下什么是标签属性。

标签属性：

    1、标签可以有多个属性，必须写在标签中，而且在标签名后面

    2、属性可以不分顺序，其中标签名和属性之间最好分开，属性之间最好分开

    3、任何标签都有默认值，省略该属性则取默认值

图像标签：<img>，有src，alt，title这几个常用属性，src：代表图片存储的路径，可以使绝对路径，也可以是相对路径；alt：引入图片时可能会出现图片路径错误等情况，而导致图片无法加载出来，所以当图片无法加载出来时就会显示出alt中的内容；title：图片显示出来时，将光标放在放在图片上，就显示出title中的内容。(../images代表images文件夹的上一级文件夹；images/pic.png表示images文件夹下的图片；first.html表示访问同一级的文件或者文件夹)，例如：

<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Document</title>
</head>

<body>
	1、图片的基本插入方式 <br>
	<img src="Picture3.png" /> <br>
	2、带有alt的图片 <br>
	<img src="Picture2.png" alt="1" /> <br>
	3、带有title的图像
	<img src="Picture3.png" title="2" /> <br>
	4、设置图片的长度和宽度，只需要设置一个即可，会等比例缩放 <br>
	<img src="Picture3.png" title="2" width="900"> <br>
	5、带有边框的图像 <br>
	<img src="Picture3.png" title="2" width="900" border="10"> <br>
</body>

</html>

链接标签：<a></a>，有href和target两个常用属性，href：代表想要跳转的地址，可以是一个网址，也可以是一个本机地址，当属性值为‘#’时，代表还没有确定链接目标；target属性中可选’_blank’，’_self’等，选中’_blank’则表示将跳转的窗口以新窗口展示出来，‘_self’则表示在当前窗口展示出来，例如：

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <h3>跳转——外部标签</h3>
    <a href="http://www.baidu.com">百度</a>
    <a href="http://www.sina.com.cn" target="_blank">新浪</a>
    <h3>跳转——内部标签</h3>
    <a href="我的html.html">今日新闻</a>
    <h3>没有确定的链接目标时</h3>
    <a href="#">我的作品</a>
</body>

</html>

特殊标签：&nbsp;——空格，&lt;——‘<’，&gt;——‘>’

列表标签：<ul><li></li></ul>，无序列表

         <ol><li></li></ol>，有序列表

注意：，ul标签中只能放li标签，但是li标签中还可以放入其他的标签，ol标签同理

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h3>My favorite fruit:</h3>
    <ul>
        <li>Apple</li>
        <li>Banana</li>
        <li>Watermalen</li>
        <li>Pear</li>
        <li>Orange</li>
        <li>
            <h3>水果蔬菜</h3>
            <p>西红柿</p>
        </li>
    </ul>
    &lt;ul&gt;标签中只能放&lt;li&gt;标签，但是&lt;li&gt;标签中可以放其他的标签
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <ol>
        <li>美国</li>
        <li>英国</li>
        <li>中国</li>
        <li>俄罗斯</li>
    </ol>
</body>
</html>

自定义列表：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <dl>
        <dt>四川省</dt> <!--名词-->
        <dd>成都市</dd> <!--解释说明-->
    </dl>
</body>
</html>

表格：

       属性：cellspacing，cellpadding……

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <!--有行的定义，但是没有列的定义，只有单元格的定义-->
    <table width="500" height="300" border="1" cellspacing="0" cellpadding="0" align="center">
        <!--单元格和边框之间的距离-->
        <!--单元格内容和单元格边框之间距离-->
        <!--管理对齐，有左对齐，右对齐和居中对齐；分别用对应单词表示代表-->
        <caption>人物信息</caption>
        <thead>
            <!--头部分-->
            <tr>
                <!--行-->
                <th>姓名</th>
                <!--单元格，单元格和<li>类似，其中可以嵌套很多的东西，但是table中只能嵌套<tr>标签，和《dl》是一样的-->
                <th>性别</th>
                <th>年龄</th>
            </tr>
        </thead>

        <tbody>
            <!--身体部分-->
            <tr>
                <td>名字1</td>
                <td>女</td>
                <td>18</td>
            </tr>

            <tr>
                <td>名字2</td>
                <td>男</td>
                <td>20</td>
            </tr>
        </tbody>
    </table>

</body>

</html>

Input标签：<input></input>，

       属性：type，可选值：

        ‘text’：文本框，

        ‘password’：密码框，

        ‘radio’：单选框

        ‘checkbox’：多选框，使用和单选框类似

        ‘button’：普通按钮

        ‘submit’：提交按钮

        ‘reset’：重置表单

        ‘image’：图像标签，使用与之前的img标签类似，

        ‘file’：提交文件

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!-- <input/> -->
    用户名：<input type = "text" value="用户名"/> <!-- 文本框 --> <br>
    密  码：<input type= "password" maxlength="10"/> <!--密码框--> <br>
    性别：<input type= "radio" name = "sex" checked = "checked"/> 女 <!--默认选中-->
    <input type="radio" name = "sex">男 <br>
    <!--一组单选框，通过相同的name值实现单选-->
    爱好：<input type="checkbox" name = "hobby" checked = "checked"> 羽毛球 
    <input type = "checkbox" name = "hobby"> 篮球 
    <input type = "checkbox" name = "hobby"> 乒乓球
    <!-- 可以同时选择多个 --> <br>
    <input type="text"> <input type = "button" value="搜索"> <!--普通按钮--> <br>
    <input type="submit" value="提交表单"> <!--提交按钮-->
    <input type="reset" valut="重置表单"> <!--重置表单--> <br>
    <input type="image" src=""> <!--图像标签，src中为图像的路径--> <br>
    提交文件： <input type="file"> 
</body>
</html>

文本域标签：<textarea></textarea>，与QQ聊天界面的输入框相似

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h3>留言板</h3>
    <textarea name="" id="" cols="30" rows="10">

    </textarea>
</body>
</html>

下拉菜单：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    省份：
    <select name="" id="">
        <option></option>
        <option selected="selected">北京</option>
        <option>上海</option>
        <option>广州</option>
        <option>深圳</option>
    </select>
    城市：
    <select name="" id="">
        <option></option>
        <option selected="selected">天安门</option> <!--默认选中项-->
        <option>朝阳区</option>
        <option>大兴</option>
        <option>通州</option>
    </select>
</body>
</html>

       表单域：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <form action="xxx.php" method="get" name="userMessage">
        用户名：<input type = "text" value="用户名"/> <!-- 文本框 --> <br>
        密  码：<input type= "password" maxlength="10"/> <!--密码框--> <br>
        性别：<input type= "radio" name = "sex" checked = "checked"/> 女 <!--默认选中-->
        <input type="radio" name = "sex">男 <br>
        <!--一组单选框，通过相同的name值实现单选-->
        爱好：<input type="checkbox" name = "hobby" checked = "checked"> 羽毛球 
        <input type = "checkbox" name = "hobby"> 篮球 
        <input type = "checkbox" name = "hobby"> 乒乓球
        <!-- 可以同时选择多个 --> <br>
        <input type="text"> <input type = "button" value="搜索"> <!--普通按钮--> <br>
        <input type="submit" value="提交表单"> <!--提交按钮-->
        <input type="reset" valut="重置表单"> <!--重置表单--> <br>
        <input type="image" src=""> <!--图像标签，src中为图像的路径--> <br>
        提交文件： <input type="file"> 
        <h3>lable 标签的使用</h3>
        <label>账户：<input type="text"></label> <!--直接用lable标签包裹住input标签即可--> <br>
        <label for="two">账户：<input type="text"><input type="text" id="two"></label>
        
    </form>
</body>
</html>

datalist标签：应该与input标签一起配合使用

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <input type="text" value="搜索明星" list="star">  
    <datalist id="star">   <!--和input一起配合使用-->
        <option>刘德华</option>
        <option>郭富城</option>
        <option>成龙</option>
        <option>张学友</option>
        <option>张柏芝</option>
    </datalist>
</body>
</html>

多媒体标签(了解)：<embed></embed>

以下是一个简单的例子：

    <embed src="https://www.bilibili.com/video/BV1rx411u7tv?p=64&share_source=copy_web" width="960" height="800"
        allowScriptAccess='always' align='middle' quality='high' allowFullScreen='true'>
    <emded />

音频播放(了解)：<audio></audio>

以下是一个简单的例子：

<audio src=”” autoplay=”autoplay” controls loop=”-1”>，分别表示音频路径，是否自动播放控制键快进，循环播放

视频播放(了解)：<video></video>

例子：<video src=”” controls autoplay width=”800px”></video>

当播放一个文件的不同数据格式时，可以使用sourse标签进行播放，以音频为例：

<audio>

       <source src=”xxx.mp3”>

       <source src=”xxx.ogg”>

</audio>

  1. 什么是CSS？

层叠样式表(英文全称：Cascading Style Sheets)是一种用来表现HTML（标准通用标记语言的一个应用）或XML（标准通用标记语言的一个子集）等文件样式的计算机语言。CSS不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。

CSS 能够对网页中元素位置的排版进行像素级精确控制，支持几乎所有的字体字号样式，拥有对网页对象和模型样式编辑的能力。

  1. 基本语法：

属性名:属性值（color:red）

  1. 分类
    • 行内样式：html标签直接使用style属性，适用于一些简单的修改
    • 内嵌样式：在html页面中写样式，但是要写在style标签中
    • 外部样式：在html页面外面写样式，并在页面当中引入，需要使用link标签
  2. 选择器：
    • 标签选择器： 
      <style>

    p {

       color: red;  // 将p标签中的文字改为红色

    }

</style>

      2.类选择器：’.’代表red是一个类，且类选择器是最为常用的

<style>

       .red {

              color: red;

       }

</style>

        ​​​​​​​        3.Id选择器：口诀：样式“#”定义，结构id调用，只能调用一次，切勿被别人使用

<style>

        #red {

               color: red;

        }

</style>

​​​​​​​​​​​​​​        ​​​​​​​        4.通配符选择器：将所有的标签都改成了相同的样式

<style>
    *{

       color: red

    }
</style>

​​​​​​​​​​​​​​        ​​​​​​​        5.后代选择器

<style>
    ul li {

       color: red;

    }

</style>
  1. 常用的样式属性：
    • 文字：字体系列，大小，粗细，颜色，对齐，装饰，缩进，行间距

                修改字体：font-family:”微软雅黑” （将字体改为微软雅黑）

                修改大小：font-size:20px (px表示像素)

                修改粗细：font-weight: 700 与font-weight: bold等效

                修改颜色：color: red （将字体颜色修改为红色）

                对齐方式：text-align: center (居中对齐，还有left和right的选项)

            装饰：text-decoration: underline(在字体上加上下划线，还有overline：上划线，line-throught：删除线，none：没有装饰等选项)

                缩进：text-indent：2em (缩进2个字符，em代表当前1个字符的大小)

                行间距：line-height：20px（行间距为20px）

​​​​​​​​​​​​​​   2. 背景

                修改背景颜色：background-color: red （将背景改为红色）

               插入背景图片：background-image：url(“images/pic.png”) (插入背景图片，url表示图片路径)

               背景平铺：background-repeat: no-repeat(不平铺，repeat：平铺，repeat-x：沿着x轴进行平铺；repeat-y：沿着y轴进行平铺)

             背景位置：background-position: center left(向左居中对齐，同理，还有向右居中对齐等)；精确位置：background-position: 20px 50px (20px: x坐标，50px: y坐标)

​​​​​​​   3. 边框线

        border-color：red （边框线设为红色）

        border-width：5px (边框宽5个像素)

        border-style：solid（实线，还有dashed和dotted选项）

        复合写法：border：red  5px  solid （参数的顺序随意）

​​​​​​​​​​​​​​   4. 间距和边距

        内边距：padding（还有左边距padding-left，上边距等同理）

        padding：5px （内边距为5px）

        padding：10px 15px （上下边距为10px，左右边距为15px）

        padding：5px 10px 15px （分别为上，左右，下边距）

        padding：5px 10px 15px 20px （分别为上，右，下，左边距）

   5. 外边距：margin（同理，还有左边距等），与padding用法几乎相同

   6. ​​​​​​​位置和布局

        浮动float：left（常用还有right属性）

        定位position：relative（相对定位），相对原来的位置进行移动，原来的位置保留，例如：

<style>
    .test1 {
        position: relative,
        top: 100px,
        left: 100px
    }
</style>

        则表示跟之前的位置相比上边距增加100px，左边距增加100px；

        absolute（绝对定位），例如：

<style>
    .test1 {
        position: absolute,
        top: 100px,
        left: 100px
    }
</style>

        表示跟最近的祖先元素相比，上边距增加100px，左边距增加100px，如果没有祖先元素则以浏览器为准进行定位。

7. ​​​​​​​隐藏和展示

display：none（不展示元素，而且不保留位置，还有block等选项）

visibility：hidden（不展示，而且保留位置，还有visible等属性）

overflow：visible（超出部分显示，还有hidden，scroll，auto等属性）

       好了，关于html和css的知识就总结到这里了，之中肯定有很多的东西没有写出来，还请大家多多体谅，同时，目前列出来的东西可能还有些错误，也请大家指正。

molongqishi
关注
HTML/CSS学习总结
豪阁的个人博客
01-01 3815
哈喽，各位新年快乐呀！今天是2019年的第一天，在这里祝愿大家新的一年能够身体健康、事事顺利，同时希望自己能够在新的一年里完成自己当初所定下的目标。 言归正传，很高兴我并没有经过多久继续更新博客，上一次发博还是在一周前的平安夜。在这一周的闲余时间里我抓紧时间学习，在W3School中文站把HTML/HTML5和CSS/CSS3的基础耐心地过了一遍，期间也完成了一些实例和测验，由于存在以往自身在其...
HTML & CSS 学习总结
chelseafall的博客
07-09 319
在这几次的学习中，我了解到了什么是HTML以及如何撰写HTML文档在这一章节中，我学习到了什么是HTML、如何构建一个HTML文档以及它的结构。
HTML总结&CSS学习总结
m0_65791148的博客
06-21 1814
HTML总结&CSS学习总结
尚硅谷（李立超）——HTML5&CSS3笔记总结【持续更新】
01-08
尚硅谷（李立超）——HTML5&CSS3笔记总结【持续更新】 本文适合前端菜鸟食用，小编自己整理的李立超老师视频的笔记，手打不易，那就望您每年快乐吧。逃） 一、进制 1.十进制（日常使用）： 特点：满10进1 计数：0 1 ...
html与css学习总结
06-17
html与css学习总结
HTML5&CSS3网页制作：CSS优先级.pptx
05-31
在网页制作中，HTML5和...总结来说，CSS优先级是决定网页元素样式效果的关键因素，包括继承、行内样式、选择器权重以及`!important`指令。通过深入理解和熟练运用这些概念，开发者能够更加高效地控制网页的视觉呈现。
Html与Css学习笔记以及经验总结
06-23
本资源主要是我业余学习Html与css相对完善的学习资源，记录了html最全面的学习经验，以及业余制作的小练习
HTML与CSS学习总结
weixin_46051260的博客
11-01 1832
HTML与CSS学习总结 一，HTML 大致学习框架是这样，具体内容有相关笔记（因为时间关系，借鉴了一起学习的同学的笔记加了自己的内容） 二，CSS CSS3具体笔记还未完善 三，三个学习阶段的学习成果 四，困难 在刚开始做淘宝页面时，因为学习时间不是很长，对网页布局不是很明确，盒子模型运用起来较为艰难，在此过程中优先级也是一大阻碍。随着慢慢的自己摸索，可以自己构建盒子模型了，但是过程中有很多地方步骤都较为繁琐。在自己做网页过程中，一定要看好网页的大致布局是什么样的，也就是找出它的大盒子，然后再
HTML&CSS 学习总结
qq_59826941的博客
07-10 322
HTML是超文本标记语言（HyperText Markup Language）的缩写，我们用HTML来构建Web页面。它定义了网页内容的含义和结构，HTML不是一门编程语言，而是一种用于定义内容结构的标记语言。HTML文件应是一个后缀名为html的文件。HTML元素：HTML使用“标记”来注明文本、图片和其他内容，便于在浏览器中显示。该标记包含一些规定的“元素”，如：，，，，，，，，，...
前端开发入门：html和css基础知识回顾
chenleismr的专栏
12-15 725
前端入门：零基础：前端基本技能，web开发基础(html+css+javascript)、学习方法、学习资料；兴趣：web技术（html+css网页制作）、ps技能、前端自动化工具、前端架构、前端MVVM、MVC、mv*框架和设计模式、各种调试web抓包工具、移动设备web调试工具、浏览器工作原理、前端安全规范和防护。 1. 文件结构：     HTML文件的固定结构：
HTML,CSS总计学习心得
qq_54746841的博客
04-04 649
HTML语言是解释型语言，不是类似java那样的编译型语言，所以在运行时不会报错也可以运行，但是在运行中有语法错误的句子直接跳过，但java不同的是java是编译型语言，所以编译不通过的话，就不可以运行，HTML在浏览器运行时，在每个浏览器运行时会有误差的，因为每个浏览器是容错的，比如在谷歌浏览器和火狐浏览器运行结果可能不太一样。 HTML界面是由一对标签组成的：<html></html>开始标签和结束标签。 <title></title>是网页标题标签，
对HTML和CSS的学习总结
qq_45274016的博客
03-02 393
对HTML和CSS的学习总结 一.块级标签和行内标签的区别： 1.块级独占一行，行内可以与其他元素共享一行 2.块级元素可以包含块级元素和行内元素 ，行内元素只能包含文本或者其它行内元素。 3.块级元素可以直接设置宽高，行内元素不能直接设置宽高 二.行内元素与块级元素总结： 行内： 超链接 <a></a> 加粗 <b></b> 最常用的行内元素<span></span> 图片<ing src="" alt=""> 文本框&
HTML&CSS学习笔记：自我记录的编程标签总结
在探讨HTML和CSS的基础知识之前，需要明确这两者是构建网页的核心技术。HTML（HyperText Markup Language）是网页内容的骨架，提供了网页的结构；而CSS（Cascading Style Sheets）则负责网页的样式和布局。接下来，...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值