html/css/Bootstrap/Font Awesome

目录

基础概念

属性:每个标签有诸多属性，可以直接写在标签内部,用于指定内容样式/功能

样式属性

响应式设计Bootstrap

图标库Font Awesome

---

基础概念

标签:使用标签指定功能，标签下面可以有子标签

标签实际上就是一个矩形

标题:<h1> -<h6>

段落:<p>

引入资源:<link>

常用于引入字体等资源，包含多个属性

href="url" :引入资源的url

rel="xxx":rel表示relation关系，指引用元素与当前页面之间的关系，常见为stylesheet样式表 

type="":引用资源类型

如<link href="https://fonts.gdgdocs.org/css?family=Lobster" rel="stylesheet" type="text/css">

引入图片:<img>

用于引入图片，需在属性内指定资源

src="url/uri":图片来源，可以为url，也可以为本地文件地址

width/heigh="xxxpx"指定大小

alt=“xxx”:图片无法正常显示时的替代文本

如：<img src="https://www.your-image-source.com/your-image.jpg">

外部链接:<a>

a即anchor（锚点），通过设置属性href指定跳转链接，同时外部写文本显示

可以使用 href="#"进行固定连接，仍跳转到本页

如果想设置跳转文字为图片，内部嵌套<img>即可

如:<a href="http://freecatphotoapp.com">cat photos</a>

无序列表:<ul>

ul即unordered list无序列表

ul用于声明无序列表，每一个表项用<li>声明

如：

<ul>
  <li>milk</li>
  <li>cheese</li>
</ul>

有序列表:<ol>

ol即ordered list无序列表

ol用于声明有序列表，每一个表项用<li>声

如：

<ol>
  <li>Garfield</li>
  <li>Sylvester</li>
</ol>

表单form:<form>

form用于指定web信息与服务器的交互，内部嵌入输入框，如<input>等进行显示,form主要用于表单数据的提交说明

action="url" ：将表单数据提交到指定url

name="xxx":为该表单项设置名字，后台读取表单参数时根据名字来读，不设置name则读不出来

如:

<form action="/submit-cat-photo&#