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="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元素是自关闭的,不需要闭合标签

 

posted @ 2017-11-25 23:44  萹豆  阅读(215)  评论(0编辑  收藏  举报