前端三剑客:HTML、CSS、JavaScript。现在就开始学习HTML啦。

学习资源:http://www.freecodecamp.cn/

学习笔记:

h1,head1,一级标题

<h1>Hello World</h1>

p,paragraph,段落

<p>Hello Paragraph</p>

<br /> ,换行

<hr /> ,水平线

<!-- This is a comment -->

颜色的三种设置方式:

<h2 style = "color:red">我家的猫咪</h2>
<style>
h2 {color:blue;}
</style>
<style>
.red-text {
color: red;
}
</style>
<h2 class= "red-text">我家的猫咪</h2>

设置图片:

<img src="https://www.your-image-source.com/your-image.jpg">
// 如果图片无法显示,显示"default text"
<img src="https://www.your-image-source.com/your-image.jpg" alt="default text">

文字链接:

<p>Here's a <a href="http://freecodecamp.cn"> link to FreeCodeCamp中文社区 </a> for you to follow.</p>

图片链接:

<a href="#"><img src="/images/relaxing-cat.jpg"></a>

创建文本输入框:

<input type="text">

创建按钮:

<button type="submit">Submit</button>
// radio button(单选按钮)
<label>
<input type="radio" name="indoor-outdoor"> indoor
</label>
<label>
<input type="radio" name="indoor-outdoor"> outdoor
</label> // checkboxes(复选按钮)
<label>
<input type="checkbox" name="personality" checked> Loving
</label>
<label>
<input type="checkbox" name="personality"> Lazy
</label>
<label>
<input type="checkbox" name="personality"> Energetic
</label>

有三个影响HTML元素布局的重要属性:padding(内边距)、margin(外边距)、border(边框)。

学习HTML的更多相关文章

  1. 从直播编程到直播教育:LiveEdu.tv开启多元化的在线学习直播时代

    2015年9月,一个叫Livecoding.tv的网站在互联网上引起了编程界的注意.缘于Pingwest品玩的一位编辑在上网时无意中发现了这个网站,并写了一篇文章<一个比直播睡觉更奇怪的网站:直 ...

  2. Angular2学习笔记(1)

    Angular2学习笔记(1) 1. 写在前面 之前基于Electron写过一个Markdown编辑器.就其功能而言,主要功能已经实现,一些小的不影响使用的功能由于时间关系还没有完成:但就代码而言,之 ...

  3. ABP入门系列(1)——学习Abp框架之实操演练

    作为.Net工地搬砖长工一名,一直致力于挖坑(Bug)填坑(Debug),但技术却不见长进.也曾热情于新技术的学习,憧憬过成为技术大拿.从前端到后端,从bootstrap到javascript,从py ...

  4. 消息队列——RabbitMQ学习笔记

    消息队列--RabbitMQ学习笔记 1. 写在前面 昨天简单学习了一个消息队列项目--RabbitMQ,今天趁热打铁,将学到的东西记录下来. 学习的资料主要是官网给出的6个基本的消息发送/接收模型, ...

  5. js学习笔记:webpack基础入门(一)

    之前听说过webpack,今天想正式的接触一下,先跟着webpack的官方用户指南走: 在这里有: 如何安装webpack 如何使用webpack 如何使用loader 如何使用webpack的开发者 ...

  6. Unity3d学习 制作地形

    这周学习了如何在unity中制作地形,就是在一个Terrain的对象上盖几座小山,在山底种几棵树,那就讲一下如何完成上述内容. 1.在新键得项目的游戏的Hierarchy目录中新键一个Terrain对 ...

  7. 《Django By Example》第四章 中文 翻译 (个人学习,渣翻)

    书籍出处:https://www.packtpub.com/web-development/django-example 原作者:Antonio Melé (译者注:祝大家新年快乐,这次带来<D ...

  8. 菜鸟Python学习笔记第一天:关于一些函数库的使用

    2017年1月3日 星期二 大一学习一门新的计算机语言真的很难,有时候连函数拼写出错查错都能查半天,没办法,谁让我英语太渣. 关于计算机语言的学习我想还是从C语言学习开始为好,Python有很多语言的 ...

  9. 多线程爬坑之路-学习多线程需要来了解哪些东西?(concurrent并发包的数据结构和线程池,Locks锁,Atomic原子类)

    前言:刚学习了一段机器学习,最近需要重构一个java项目,又赶过来看java.大多是线程代码,没办法,那时候总觉得多线程是个很难的部分很少用到,所以一直没下决定去啃,那些年留下的坑,总是得自己跳进去填 ...

  10. node.js学习(三)简单的node程序&&模块简单使用&&commonJS规范&&深入理解模块原理

    一.一个简单的node程序 1.新建一个txt文件 2.修改后缀 修改之后会弹出这个,点击"是" 3.运行test.js 源文件 使用node.js运行之后的. 如果该路径下没有该 ...

随机推荐

  1. POj3017 dp+单调队列优化

    传送门 解题思路: 大力推公式:dp[i]=min(dp[k]+max(k+1,i)){k>=0&&k<i},max(j,i)记为max(a[h]){h>k& ...

  2. python3(二十四) subClas

    """ 继承的多态 """ __author__ = 'shaozhiqi' # -----------------父类---------- ...

  3. web自动化测试中的PO模式(一)

    1.PO模式的思想 原理: 将页面的元素定位和元素行为封装成一个page类 类的属性:元素的定位 类的行为:元素的操作 页面对象和测试用例分离 测试用例: 调用所需要页面对象中的行为,组成测试用例 测 ...

  4. std::string::append函数

    string& append (const string& str); string& append (const string& str, size_t subpos ...

  5. MySQL中information_schema 数据库 是干什么的

    MySQL中information_schema是什么 大家在安装或使用MYSQL时,会发现除了自己安装的数据库以外,还有一个information_schema数据库. information_sc ...

  6. Arthas-Java的线上问题定位工具

    Arthas(阿尔萨斯) 能为你做什么? Arthas 是Alibaba开源的Java诊断工具,深受开发者喜爱. 当你遇到以下类似问题而束手无策时,Arthas可以帮助你解决: 这个类从哪个 jar ...

  7. AJ学IOS 之微博项目实战(6)导航控制器NavigationController 的滑动回退功能实现

    AJ分享,必须精品 一:效果 第二篇里面写了怎样自定义navigation实现自定义的导航控制器左右按钮样式,但是当我们自己实现后,系统自带的向右边滑动来实现回退的功能就不能用了. 这里主要实现滑动回 ...

  8. 2019-07-31【机器学习】无监督学习之降维PCA算法实例 (鸢尾花)

    样本 代码: import matplotlib.pyplot as plt from sklearn.decomposition import PCA from sklearn.datasets i ...

  9. 练习,自定义TextView(1.1)

    重新自定义TextView是非常有趣的事情,跟着Android4高级编程,通过自定义TextView,来敲一下代码: 这个是那么的简单,自定义TextView,新建CustomTextView继承Te ...

  10. java接口工厂模式理解

    作为实际java开发经验还不到一年的我,第一次写博客,诚惶诚恐,怕把自己的谬误公之于众,误人子弟,不过转念一想,若是能有同行加以指点评判,将他们的真知灼见描述出来,那这篇文章就算抛转引玉了. 最近在阅 ...