首页 > 代码库 > 2017/5/10 freeCodeCamp 前端部分-html+css-总结

2017/5/10 freeCodeCamp 前端部分-html+css-总结

HTML即Hyper Text Markup Language(超文本标记语言)。

<h1>Hello</h1>

开始标签,结束标签。中间为显示文本。标签属性在开始标签中。

基本标签结构:

<html>  <!-- 根标签-->

<head>

    <title><title>

</head>

<body>

</body>

<html>

<!- -- -> 增加/删除注释

 

通过在开始标签中修改属性,从而修改显示文本的属性。

<h2 style="color: blue">CatPhotoApp</h2>

用css的方式修改如下:

<style>
  选择器 {属性名称: 属性值;}
  h2 {color: red;}
</style>

 

用css声明类选择器:

<style>
  .blue-text {
    color: blue;
  }
</style>

然后在标签上应用:

<h2 class=‘blue-text‘>我家的猫咪</h2>

段落字号,字体修改:

p {
font-size: 16px;
font-family: Monospace;
}

引入字体:

<link href="https://fonts.gdgdocs.org/css?family=Lobster" rel="stylesheet" type="text/css"> <!--以谷歌Lobster字体为例-->

图片添加

<img src="https://www.your-image-source.com/your-image.jpg"> <!-- 图片大小格式修改与字体修改方式一致-->

<style>
  .larger-image {
    width: 500px;
  }
</style>

然后用class继承。

初次写博,想换一种方式。

 

2017/5/10 freeCodeCamp 前端部分-html+css-总结