美文网首页
Learn HTML&CSS he hard way I

Learn HTML&CSS he hard way I

作者: INTERNALENVY | 来源:发表于2016-06-02 00:30 被阅读38次

有序列表、无序列表、自定义列表如何使用?写个简单的例子。三者在语义上有什么区别?在哪些情况下使用哪种(重要)? 如何嵌套?


如图所示,有序列表显然应该是用于强调事物顺序的地方,比如步骤等,无序则用于清单等不需要太在意顺序的地方,自定义列表则用于自由组合的地方,比如列举事物的属性

如何去除列表前面的点或者数字?


list-style:none

class 和 id 有什么区别?什么时候用 class 什么时候用 id?


class代表类,可以多次使用,一般用在一个可能会多次在项目中出现的功能属性上,比如排列,颜色等等。

id是特有的,只能出现一次,使用id代表设置只针对该id有效,即使在其他地方用到也需要重新设置新的类或id,同时id也可以用于定位,利用herf直接跳转到id所在位置。

块级元素、行内元素是什么?有什么区别?分别对应哪些常用标签?


块级元素:

blockquote

div

dl

ol

ul

table

fieldset

h(1-6)

行内元素:

br

em

img

label

span

var

teatxarea

label

块元素会直接占领一行,而行元素只占有元素宽度那么宽;块元素上下左右的边距都存在,行内元素只有左右边距会占据空间。

display: block、display: inline、display: inline-block分别有什么作用?


display:block是把元素设置为块级元素

display:inline设置为行内元素

display:inline-block设置为既具有inline又具有block属性当对象

设置为block后,大小以及所有边距都可以控制,会独占一行。

设置为inline后,上下边距不能控制,宽度就是元素宽度加边距,不额外设置的话元素水平排列

inline-block,既可以像行内元素一样在一行排列,又可以像块元素一样设置上下外边距

下面代码是做什么的?抄写一遍下面的代码,注意class和id的使用及命名方式


设置了三大块,header content,footer。

如何理解 HTML CSS 语义化? 在平时写代码的过程中要注意哪些细节


HTML CSS语义化是为了是开发人员更好地理解程序,毕竟读懂三个月以前写的代码,并不是一件容易的事情。

使用正确的标签和名字,来编写代码,会使得代码可读性更高,更利于维护,同时方便爬虫和浏览器当解析。

form表单有什么作用?有哪些常用的input 标签,分别有什么作用?


form表单用于把用户输入的数据提交到后台。

常用的input标签:

text

textarea

password

radio

checkbox

post 和 get 方式的区别?


默认情况下是get

post安全性更好,可以传输更大当文件,并且不会在url里被看到

get在url里会被看到,安全性较差,有传输大小限制,适合传送较小的不重要当表格

在input里,name 有什么作用?


name是给标签加一个名字,这样在表单传递给后台数据库的时候,会出现task6.php?name=envy这样当字眼,相当于给用户的数据加了一个属性标签,便于传输管理。

<button>提交</button>、<a class="btn" href="#">提交</a>、<input type="submit" value=“提交”>三者有什么区别?


<button>只是一个按钮图标,这个按钮不会有其他功能(如果不额外设置的话)


<a class="btn" href="#">相当于一个链接,单击后跳到对应链接

<input>才是真正当表单,就是这节课所学的,输入数据,会传到后台

radio 如何 分组?


name取一样的

<input type="radio" name="1" value="nihao">

<input type="radio" name="1" value="nibuhao">

placeholder 属性有什么作用?


placeholder会在未输入文字时出现,作为提示。

type=hidden隐藏域有什么作用? 举例说明


隐藏域,用户看不到,用来暂存数据。

<input type="hidden" name="secreat" vaule="mimi">

可以用来确认这个网站是不是我给用户的

代码


已上传

相关文章

  • Learn HTML&CSS he hard way I

    有序列表、无序列表、自定义列表如何使用?写个简单的例子。三者在语义上有什么区别?在哪些情况下使用哪种(重要)? 如...

  • Learn HTML&CSS the hard way

    Q:视频中的.main中的float是不是可以去掉呢,因为.ct已经清除浮动了。 A:单纯的防止父元素塌陷的话可以...

  • Learn HTML&CSS the hard way

    如何调试 IE 浏览器 1.IE7+有自带调试工具,早期版本就手动添加边框颜色来观察盒模型吧。 2.采用模拟器,例...

  • Learn HTML&CSS the hard way

    盒模型包括哪些属性 marginpaddingbordercontentwidthheight text-alig...

  • Learn HTML&CSS the hard way

    CSS选择器常见的有几种? 元素选择器: divulolh1-6pa 类选择器: .class{} id选择器: ...

  • Learn HTML&CSS the hard way

    CSS Sprite(雪碧图|精灵图)指什么? 有什么作用 因为一个网页可能会有很多图片,一个一个请求的话会影响到...

  • Learn HTML&CSS the hard way

    样式有几种引入方式? link 和 @import有什么区别 1. 标签: p { background-colo...

  • Learn HTML&CSS the hard way

    line-height有什么作用? 设置行高。使文本垂直居中(高度须与div一致,并且长度在一行之内)。 如何去查...

  • Learn HTML&CSS the hard way

    文档流的概念指什么?有哪种方式可以让元素脱离文档流? 文档流就是普通流,没有定位浮动什么样式的最开始的那一个层面,...

  • Learn HTML&CSS the hard way

    在什么场景下会出现外边距合并?如何合并?如何不让相邻元素外边距合并?给个父子外边距合并的范例 想出现外边距合并: ...

网友评论

      本文标题:Learn HTML&CSS he hard way I

      本文链接:https://www.haomeiwen.com/subject/wdbhdttx.html