代码如下

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel = "stylesheet" type ="text/css" href = "css/1.css">
<title>Insert title here</title>
<style type="text/css">
/* 选择器 :标签选择器 属性值不区分大小写,选择器区分大小写,一般都是小写
如果属性值为多个单词中间由空格隔开,必须用双引号
float : 浮动 left 向左浮动 让div在一行
*/ </style>
</head>
<body>
<div class = "main"> <div class = "div1">
<input type = "text" placeholder = "search"/>
</div>
<div class = "div2" >2</div>
</div>
</body>
</html>

1.css

    div {
color : red; /* 设置字体颜色*/
border : 1px solid #0f0; /* 边框宽度 实线 颜色 */
font-family : "The new Roman";/* 字体样式*/ } .main{
width :400px; /* 宽度 */
height : 200px;/* 高度 */
margin : 0 auto;
}
.main .div1{
width : 60%;
height : 50%;
float :left; /* 向左浮动 */
line-height : 200px;
}
.main .div2 {
width : 20%;
float : left;
inline-height : 200px;
line-height : 200px;
border-radius : 5px;
margin : 0 auto;
display : block ;
}
.main .div1 input {
margin : 10px 20px;
border-radius : 10px;
}

div+css的常规使用的更多相关文章

  1. 前端之DIV+CSS布局

    刚开始学习javaweb,首先定位学习后端,可是随着学习的深入和项目的进行,越来越发现前端知识的欠缺,之前也随着视频看过,随着时间的流逝,具体的应用也随之忘记了. 而现在开始自己练习项目,发现前端知识 ...

  2. DIV+CSS+JS基础+正则表达式

    ...............HTML系列....................        DIV元素是用来为HTML文档内大块(block-level)的内容提供结构和背景的元素.DIV的起始 ...

  3. 利用DIV+CSS制作网页过程中常用的基本概念及标签使

    CSS主要用于对HTML文件功能的补充及扩展,其作用就是对HTML文件中各种排版进行设置,达到对网页中字体.颜色.背景.图片等的控制,使网页能够完全依照设计者的想法来显示. CSS可以控制网页的显示, ...

  4. 利用DIV+CSS制作网页过程中常用的基本概念及标签使用细节

    CSS主要用于对HTML文件功能的补充及扩展,其作用就是对HTML文件中各种排版进行设置,达到对网页中字体.颜色.背景.图片等的控制,使网页能够完全依照设计者的想法来显示. CSS可以控制网页的显示, ...

  5. DIV CSS布局中绝对定位和浮动用法

    转自:http://developer.51cto.com/art/201009/223337_1.htm 你对DIV CSS布局中绝对定位和浮动的概念及使用是否熟悉,这里和大家分享一下,CSS中,实 ...

  6. DIV+CSS布局中主要CSS属性介绍

    Float: Float属性是DIV+CSS布局中最基本也是最常用的属性,用于实现多列功能,我们知道<div>标签默认一行只能显示一个,而使用Float属性可以实现一行显示多个div的功能 ...

  7. div+css页面右侧底部悬浮层

    效果体验:http://hovertree.com/texiao/css/23/ 效果图: 代码如下: <!DOCTYPE html> <html> <head> ...

  8. DIV+CSS规范命名大全

    网页制作中规范使用DIV+CSS命名规则,可以改善优化功效特别是团队合作时候可以提供合作制作效率,具体DIV CSS命名规则CSS命名大全内容篇. 常用DIV+CSS命名大全集合,即CSS命名规则 D ...

  9. DIV+CSS 清除浮动方法总结

    DIV+CSS 清除浮动是页面布局中常见的问题,相信各位高手也都有自己的方法,今天在这里对常见的几种方法进行总结(PS:谈不上是原创,这里是我自己做的归纳总结,也是我自己内化的过程),希望对您能够有所 ...

随机推荐

  1. maven中target不能访问

    原因是maven  clean的时候已经把target文件夹删除  但是文件夹还存在页面中  所以我们看得到但是不能打开.正常操作是获得管理员权限删除后再重新clean,但是我电脑有360,直接360 ...

  2. Maven不能下载SNAPSHOT包但是能下载RELEASE包的解决办法

    在使用过程中,Maven默认配置是不能下载SNAPSHOT包的,这是基于一种代码稳定性进行考量得出的结论.引入SNAPSHOT包最大的问题就是,由于SNAPSHOT允许重复上传,所以引用一个这样的包开 ...

  3. babel 7.x 和 webpack 4.x 配置vue项目

    很偶然的今天想开个自己的小项目,记录一下最近项目工程上实现的一个小交互.按照之前运行非常流畅的配置走一遍,打包遇到各种坑.只好根据命令行的报错逐个排查,发现babel升级了一个大版本,已经到7.x了. ...

  4. 解决 IntelliJ IDEA Tomcat 控制台中文输出乱码问题

    解决办法 找到安装IDEA的bin目录将idea.exe.vmoptions和idea64.exe.vmoptions两个文件打开分别在文件最末尾添加-Dfile.encoding=UTF-8

  5. oracle 对表的操作

    对日期数据的插入 insert into tabname(datecol) value(sysdate) ;  -- 用date值 insert into tabname(datecol) value ...

  6. C++中的string类型转换为int类型

    给定一个十进制整数n,输出n的各位数字之和 #include<iostream> #include<string> using namespace std; int main( ...

  7. flutter 读写文件

    import 'package:flutter/material.dart'; import 'package:path_provider/path_provider.dart'; import 'd ...

  8. javascript的对象内容对比

    vue是这样对比的 function looseEqual (a, b) { if (a === b) return true const isObjectA = isObject(a) const ...

  9. [十二省联考2019]异或粽子 01trie

    [十二省联考2019]异或粽子 01trie 链接 luogu 思路 首先求前k大的(xo[i]^xo[j])(i<j). 考场上只想到01trie,不怎么会写可持久,就写了n个01trie,和 ...

  10. npm 是node.js下带的一个包管理工具

    npm 是node.js下带的一个包管理工具          npm install -g webpack webpack是一个打包工具 gulp是一个基于流的构建工具,相对其他构件工具来说,更简洁 ...