首先打开sublime text软件,新建一个html文件,输入基本的html结构:
2.
然后设置一个div,并设置div的class属性,在上方的style中设置样式,设置背景颜色、高度和宽度并设置border边框和边框的圆角属性,完成后保存:
3.
最后打开浏览器就可以看到效果:
在HTML中把块的边框做成圆角需要利用css的border-radius属性。
*** 作步骤:
1、打开Adobe Dreamweaver CC 2015。
2、执行菜单栏中的"文件的新建"命令或按住Ctrl+N键打开"新建文档"对话框,选择其文档类型为HTML,单击"创建"按钮,即创建一个网页文档。
3、在<body>和</body>之间添加"<form></form>",如下图所示。表单使用的<form>标记是成对出现的,在首标记<form>和尾标记</form>之间的部分就是一个表单。
4、在<form>和</form>之间添加"<input name="text" type="submit" value="登录" class="input_box">",如下图所示。
5、在<head>和</head>之间添加"<style type="text/css"></style>",如下图所示。
6、在<style type="text/css">和</style>之间添加".input_box{width:360pxheight:40pxborder-radius:20pxborder-style:nonebackground:#ec6941font-size:14pxcolor:rgba(249,248,248,1.00)}",如下图所示。
7、保存网页文件,按住F12键可以在浏览器中预览效果,如下图所示。
语法说明
输入<input>是个单标记,必须嵌套在表单标记中使用,用于定义一个用户的输入项。
name属性:输入字段的识别名称,传递数据时的参数名称。
type属性:输入字段的类型。button是表单通用按钮。
value属性:表单字段预设数据值。例如用于button、submit、reset等字段类型指的是按钮标签的显示文字。
class属性:对应于网页中的CSS选择器名称。
1、打开htm1软件,打开工作区空间,选择需要进行 *** 作的文件夹,点击上方的新建文件选项。2、在d出的文本框中给html文件命名,文件后缀名要以html结尾,文件命名为round,html,建议使用功能性的文件命名方式。
3、在新建的html文件中输入设置圆角矩形按钮彩虹条CSS代码。
4、在代码的空白区域右击在d出的选项卡中选择Open,In,Default,Browser选项。
5、点击运行之后,在浏览器网页中显示出制作的圆角矩形彩虹条的效果。
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)