<form action="/submit-cat-photo" >action
属性的值指定了表单提交到服务器的地址
<input type="text" placeholder="cat photo URL" required> placeholder预定义输入框内的文本,添加required
属性,这样用户不填写输入框就无法提交表单
<button type="submit"> submit</button> 为form添加一个submit
(提交)按钮,点击这个按钮,表单中的数据将会被发送到你通过action
属性指定的地址上
</form> (数据提交框)
<form action="/submit-cat-photo" >
<label><input type="radio" name="indoor-outdoor" checked> Indoor</label> name值要一样,input无闭合标签,使用checked
属性,你可以设置复选按钮和单选按钮默认被选中
<label><input type="radio" name="indoor-outdoor">outdoor</label> radio (单选按钮,多选一圆圈按钮)
</form>
<style>
#cat-photo-form{
background-color: green;
}
</style>
<form action="/submit-cat-photo" id="cat-photo-form" >为表单添加背景颜色为绿色
<label><input type="checkbox" name="personality" checked> Loving</label> 复选按钮的name
属性值要一样,使用checked
属性,你可以设置复选按钮和单选按钮默认被选中
<label><input type="checkbox" name="personality"> Love</label>
<label><input type="checkbox" name="personality"> LL</label> checkbox(复选框,多选正方形打勾按钮)
</form>
<div class=" "><h2></h2><p></p><ul><li></li></ul></div> div可包含多个元素,id值只能唯一,不能重复使用同一个
padding(内边距)
、margin(外边距)
、border(边框),
元素的
padding
控制元素内容 content
和元素边框 border
之间的距离
元素的外边距 margin
控制元素边框 border
和元素实际所占空间的距离,可以是负数
padding-top
、padding-right
、padding-bottom
和 padding-left
来控制元素上右下左四个方向的 padding
margin-top
、margin-right
、margin-bottom
和 margin-left
来控制元素上右下左四个方向的 margin
可以集中起来指定它们,举例如下:
padding: 10px 20px 10px 20px;上右下左,
padding: 30px10px 20px;;上,左右,下
padding: 30px10px ;上下,左右
每一个 HTML 页面都有一个 body
元素
并且其 body
元素同样能够应用样式
对其他 HTML 元素一样对 body
元素应用样式,并且所有其他元素将继承 body
元素的样式,子元素会继承父元素的样式
利用 选择器的特殊性等级进行样式覆盖,特殊性高的覆盖特殊性低的样式
在 <style>
部分中 class
声明的顺序却非常重要,第二个声明总是比第一个具有优先权, id 属性总是具有更高的优先级
行内样式〉内嵌式〉外联式
56