fcc html5 css 练习1
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的更多相关文章
- fcc html5 css 练习3
行内样式看起来是这样的 <h1 style="color: green"> .pink-text { color: pink !important; } ...
- fcc html5 css 练习2
<form action="/submit-cat-photo" >action属性的值指定了表单提交到服务器的地址 <input type="text ...
- HTML5 & CSS初学者教程(详细、通俗易懂)
前端语言基础:HTML5 & CSS (一) HTML5:超文本标记语言 (1) 基本概念 是由一系列成对出现的元素标签(标记)嵌套组合而成 ( XML也是标签构成的 ) 这些标签以的形式出现 ...
- 使用 HTML5 & CSS 实现一个自定义开关按钮 switch button
使用 HTML5 & CSS 实现一个自定义开关按钮 switch button switch button <div class="switch"> < ...
- html5/css学习笔记
请始终将正斜杠添加到子文件夹.假如这样书写链接:href="http://www.w3cschool.cc/html",就会向服务器产生两次 HTTP 请求.这是因为服务器会添加正 ...
- 【原】无脑操作:HTML5 + CSS + JavaScript实现比赛排程
1.背景:朋友请帮忙做一个比赛排程软件 2.需求: ① 比赛人数未知,可以通过文本文件读取参赛人员名称: ② 对参赛人员随机分组,一组两人,两两PK,如果是奇数人数,某一个参赛人员成为幸运儿自动晋级: ...
- 酷炫,用Html5/CSS实现文字阴影
前两天有一个学html5前端小美女问我一个有关文字阴影的效果怎么去实现.她和我说文字阴影嘛,她也知道text-shadow,.但是却做不出想要的样子,其实css3的新功能是很强大的,不要把你的思想太过 ...
- HTML5&CSS挑战
地址:https://www.w3cschool.cn/codecamp/list?pename=html5_and_css_camp 开始学习HTML标签:欢迎来到编程训练营的第一个编程挑战!你可以 ...
- 笔记 jsp/ajax/js/jquery/html5/css+div->table
1. jsp 1).jsp(39,33) equal symbol expected: 这个异常是说第39行有 " '( 冒号单引号)问题 2)${map[key]} map和key换 ...
随机推荐
- Codeforces Round #249 (Div. 2) 总结
D.E还是很难的.....C不想多说什么... A:提意:给出每一组人的个数,以及一次车载容量,求出最少需要多少次才能载走所有的人. water: http://codeforces.com/cont ...
- Ubuntu 16.04安装Adobe AIR
安装: wget -O adobe-air.sh http://drive.noobslab.com/data/apps/AdobeAir/adobe-air.sh chmod +x adobe-ai ...
- Luca Canali
https://github.com/LucaCanali http://cern.ch/canali/
- 解DBA之惑:数据库承载能力评估及优化手段
原创 2016-08-29 韩锋 DBAplus社群 作者介绍 韩锋,宜信技术研发中心数据库架构师.精通多种关系型数据库,曾任职于当当网.TOM在线等公司,曾任多家公司首席DBA.数据库架构师等职 ...
- I/O 模型及其设计模式
来源:伯乐在线 - 咸菜 链接:http://blog.jobbole.com/104638/ 前言 I/O在软件开发中的重要性无需多言,无论是在操作系统.网络协议.DBMS这种底层支撑软件还是在移动 ...
- OSX: node中安装zeromq
1. brew install pkg-config2. brew install zmq3. export PKG_CONFIG_PATH="/usr/local/lib/pkgconfi ...
- 从理论到实践,全方位认识DNS(实践篇)
在理论篇中,我们基本了解了DNS的整个协议原理,但是可能还会有着下面的疑问: 为什么我想申请的域名都没了? DNS 域名还要备案,这是为什么啊? 如何将刚申请的域名绑定到自己的网站呢? 怎么才能看到那 ...
- 在全程Linux環境部署IBM Lotus Domino/Notes 8.5
架設藍色巨人的協同合作訊息平台 在全程Linux環境部署IBM Lotus Domino/Notes 8.5 珊迪小姐 坊間幾乎所有探討IBM Domino/Notes的中文書籍,皆是以部署在Micr ...
- [JavaEE] Implement a REST Endpoint
1. Create a rest folder with JAXRSConfiguration.java: package com.pluralsight.bookstore.rest; import ...
- [WebGL入门]十二,模型数据和顶点属性
注:文章译自http://wgld.org/,原作者杉本雅広(doxas),文章中假设有我的额外说明,我会加上[lufy:].另外.鄙人webgl研究还不够深入,一些专业词语.假设翻译有误.欢迎大家指 ...