font-size:  字号

利用link导入新字体再引用<link href="https://fonts.gdgdocs.org/css?family=Lobster" rel="stylesheet" type="text/css">

font-family: 字体

font-family: Helvetica, Sans-Serif;假如浏览器不支持第一种字体,会默认使用自带的第二种字体

<img src="/your/image.jpg">

注意:img元素是自关闭元素,不需要结束标记

width: 500px;可以控制图片宽度

可以应用多个class到一个元素,只需要在多个class之间用空格分开即可。例如:

<img class="class1 class2">

border-color: red;   边框颜色

border-width: 5px;   边框宽度

border-style: solid;   边框样式为固体

border-radius: (边框半径)的属性来让它的边框变成圆的,属性值可以是像素或者是百分比

<p>View more <a href="http://www.freecatphotoapp.com">cat photos</a></p>链接可以在文本当中,more 后面要有空格显示出more cat,否则morecat显示会连一起

<a href="#">把a元素的href属性的值替换为一个#,别名hash(哈希)符号,将其变为一个固定链接

<a href="#"><img src="/images/relaxing-cat.jpg"></a>可以把你的图片嵌套进a元素,把图片变成链接

<img src="data:image.jpg" alt="text">每一张图片都应该有一个alt属性

无序排列

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

有序列表

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

Text input(文本输入框)是用来获得用户输入的绝佳方式

<input type="text">

注意,input元素是自关闭的,不需要闭合标签

fcc html5 css 练习1的更多相关文章

  1. fcc html5 css 练习3

    行内样式看起来是这样的 <h1 style="color: green"> .pink-text { color: pink !important; }         ...

  2. fcc html5 css 练习2

    <form action="/submit-cat-photo" >action属性的值指定了表单提交到服务器的地址 <input type="text ...

  3. HTML5 & CSS初学者教程(详细、通俗易懂)

    前端语言基础:HTML5 & CSS (一) HTML5:超文本标记语言 (1) 基本概念 是由一系列成对出现的元素标签(标记)嵌套组合而成 ( XML也是标签构成的 ) 这些标签以的形式出现 ...

  4. 使用 HTML5 & CSS 实现一个自定义开关按钮 switch button

    使用 HTML5 & CSS 实现一个自定义开关按钮 switch button switch button <div class="switch"> < ...

  5. html5/css学习笔记

    请始终将正斜杠添加到子文件夹.假如这样书写链接:href="http://www.w3cschool.cc/html",就会向服务器产生两次 HTTP 请求.这是因为服务器会添加正 ...

  6. 【原】无脑操作:HTML5 + CSS + JavaScript实现比赛排程

    1.背景:朋友请帮忙做一个比赛排程软件 2.需求: ① 比赛人数未知,可以通过文本文件读取参赛人员名称: ② 对参赛人员随机分组,一组两人,两两PK,如果是奇数人数,某一个参赛人员成为幸运儿自动晋级: ...

  7. 酷炫,用Html5/CSS实现文字阴影

    前两天有一个学html5前端小美女问我一个有关文字阴影的效果怎么去实现.她和我说文字阴影嘛,她也知道text-shadow,.但是却做不出想要的样子,其实css3的新功能是很强大的,不要把你的思想太过 ...

  8. HTML5&CSS挑战

    地址:https://www.w3cschool.cn/codecamp/list?pename=html5_and_css_camp 开始学习HTML标签:欢迎来到编程训练营的第一个编程挑战!你可以 ...

  9. 笔记 jsp/ajax/js/jquery/html5/css+div->table

    1. jsp 1).jsp(39,33)   equal symbol expected: 这个异常是说第39行有 " '( 冒号单引号)问题 2)${map[key]}  map和key换 ...

随机推荐

  1. [K/3Cloud]关于"选单"操作

    之前有些人对这块有些疑问,比如: 1.选单操作是否和下推基本一样,都是公用同一套单据转换规则,只不过下推是源单推目标单,选单是目标单去选择源单,最终操作结果一样? 2,我想实现选单的时候,选单列表先通 ...

  2. JSOI最大值 (线段树)

    change 单点修改 query 区间最值 Program XJOI2321; ; ..maxn*] of longint; i,m,n,ans,p,x:longint; ch:char; func ...

  3. Linux下汇编语言学习笔记75 ---

    这是17年暑假学习Linux汇编语言的笔记记录,参考书目为清华大学出版社 Jeff Duntemann著 梁晓辉译<汇编语言基于Linux环境>的书,喜欢看原版书的同学可以看<Ass ...

  4. android Fragment用法

    Fragment常用的三个类:android.app.Fragment 主要用于定义Fragmentandroid.app.FragmentManager 主要用于在Activity中操作Fragme ...

  5. MySQL出现:com.mysql.jdbc.exceptions.jdbc4.CommunicationsException: Communications link failure Last packet sent to the server was 0 ms ago.

    1.首先检查生产环境的机器是否ping的通和telnet的通数据库 2.排查数据库连接的参数 3.看数据量是否很大 参考: http://blog.csdn.net/sclxf/article/det ...

  6. 网络请求之GET、POST请求

    网络请求-GET请求: 1,NSURL: 请求地址. 2,NSURLRequest :一个NSURLRequest对象就代表一个请求.它包括的信息有: 1)一个NSURL对象 GET请求,不须要写请求 ...

  7. PHP移动互联网开发笔记(3)——运算符

    原文地址:http://www.php100.com/html/php/rumen/2014/0326/6704.html 一.PHP的运算符 PHP中有丰富的运算符集,它们中大部分直接来自于C语言. ...

  8. 【UI自动化方面】

    1.自动化执行失败如何排查故障. 答:1).查看log,错误原因.[log不详细的话,可以优化] 2).排查是否真的有bug,若不是bug查看是否是新版本引入了新的变更. 3).调试脚本看自己脚本是不 ...

  9. LeetCode 8. String to Integer (atoi) (字符串到整数)

    Implement atoi to convert a string to an integer. Hint: Carefully consider all possible input cases. ...

  10. 关于linux的用户

    1 linux支持多个用户 2 每个登陆用户有自己的shell,自己的home目录 3 可以将用户分组 4 用户对文件有各自的权限,从而将用户分割 5 用户对应属于它的一批进程 6 可以执行addus ...