我要制作进度条。 这是代码。
.outer {
overflow: auto;
width: 500px;
height: 300px;
}
.inner {
/* Uncommmet next line, and the border-radius will disappear. */
/* height: 500px; */
}
.progress {
width: 100%;
border-radius: 40px;
height: 80px;
background-color: #f5f7fa;
overflow: hidden;
}
.progress-basic {
background-color: #3890ff;
height: 100%;
width: 100%;
/* Removing the opacity can fix this bug. But why? */
opacity: 0.8;
}<div class="outer">
<div class="inner">
<div class="progress">
<div class="progress-basic">
</div>
</div>
</div>
</div>
div.progress有overflow:hidden和border-radius:40px。因此，div.progress-basic应该显示为border-radius。
到目前为止一切正常。但是当滚动条显示在其父元素中（在这种情况下为div.outer）时，border-radius就会消失。
我的Chrome版本为52.0.2743.116（64位）。我也在Safari和Firefox中测试了这个bug，没有问题。
我发现了一个奇怪的解决方案。如果我删除.progress-basic中的不透明度，一切都会按预期工作。但我不知道为什么，我真的需要不透明度。
这是一个显示此错误的codepen。 http://codepen.io/tanbowensg/pen/akZPEb
答案 0 :(得分：0)
border-radius仍然应用于父// main function
#include "Calculator.h"
#include "Mats.h"
#include <iostream>
#include <vector>
using namespace std;
int main()
{
int N = 4;
Mats Menno(N);
Calculator Calli(Menno);
Calli.getMatrices().printF();
Calli.getMatrices().setf(2,1);
Calli.getMatrices().printF();
}
// Calculator header
#ifndef CALCULATOR_H
#define CALCULATOR_H
#include "Mats.h"
#include <vector>
class Calculator
{
public:
Calculator(Mats M);
Mats getMatrices();
protected:
private:
Mats Matrices;
};
#endif // CALCULATOR_H
// Calculator cpp
#include "Calculator.h"
#include "Mats.h"
#include <iostream>
#include <vector>
using namespace std;
Calculator::Calculator(Mats M)
: Matrices(M)
{
}
Mats Calculator::getMatrices(){
return Matrices;
}
// Mats header
#ifndef MATS_H
#define MATS_H
#include "Calculator.h"
#include <vector>
class Mats
{
public:
Mats(int N);
int getf(int i);
void setf(int i, int fh);
std::vector<int> getF();
void printF();
protected:
private:
std::vector<int> F;
};
#endif // MATS_H
// Mats cpp
#include "Calculator.h"
#include "Mats.h"
#include <iostream>
#include <vector>
using namespace std;
Mats::Mats(int N)
{
std::vector<int> Fh;
F = Fh;
F.resize(N);
for (int i = 0;i<N;i++){
F[i] = -1;
}
}
int Mats::getf(int i){
return F[i];
}
void Mats::setf(int i, int fh){
F[i] = fh;
}
std::vector<int> Mats::getF(){
return F;
}
void Mats::printF(){
F[1] = 300;
cout << "F: " << endl;
for (int i = 0; i<F.size(); i++) {
cout << F[i] << " ";
}
cout << endl;
F[1] = 200;
}
，但内部public class ListAdapterWifi extends BaseAdapter {
Context context;
LayoutInflater inflater;
List<ScanResult> wifiList;
public ListAdapterWifi(Context context, List<ScanResult> wifiList) {
this.context = context;
this.wifiList = wifiList;
inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
}
@Override
public int getCount() {
return wifiList.size();
}
@Override
public Object getItem(int position) {
return null;
}
@Override
public long getItemId(int position) {
return 0;
}
@Override
public View getView(int position, View convertView, ViewGroup parent) {
Holder holder;
System.out.println("viewpos" + position);
View view = convertView;
if (view == null) {
view = inflater.inflate(R.layout.listeadapter, null);
holder = new Holder();
holder.tvDetails = (TextView) view.findViewById(R.id.tvDetails);
view.setTag(holder);
} else {
holder = (Holder) view.getTag();
}
holder.tvDetails.setText("SSID :: " + wifiList.get(position).SSID
+ "\nForce du signal reçu :: " + wifiList.get(position).level
+ "\n@ mac du point d'accès :: " + wifiList.get(position).BSSID
+ "\nCanal :: "
+ convertFrequencyToChannel(wifiList.get(position).frequency)
+ "\nFréquence :: " + wifiList.get(position).frequency
+ "\nType de sécurité :: " + wifiList.get(position).capabilities);
return view;
}
public static int convertFrequencyToChannel(int freq) {
if (freq >= 2412 && freq <= 2484) {
return (freq - 2412) / 5 + 1;
} else if (freq >= 5170 && freq <= 5825) {
return (freq - 5170) / 5 + 34;
} else {
return -1;
}
}
class Holder {
TextView tvDetails;
}
}
正在显示。出于某种原因，使用不透明度设置它认为它需要在其父边界半径之外渲染（它填充整个矩形区域）。
请参阅此代码：http://codepen.io/anon/pen/vXBYRo
我更改了public class WifiMonitorActivity extends Activity {
private WifiManager mainWifi;
private WifiReceiver receiverWifi;
private Button btnRefresh;
ListAdapterWifi adapter;
ListView lvWifiDetails;
public List<ScanResult> wifiList;
WifiManager wifi;
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.wifiresult );
lvWifiDetails = (ListView) findViewById(R.id.lvWifiDetails);
btnRefresh = (Button) findViewById(R.id.btnRefresh);
mainWifi = (WifiManager) getSystemService(Context.WIFI_SERVICE);
receiverWifi = new WifiReceiver();
registerReceiver(receiverWifi, new IntentFilter(
WifiManager.SCAN_RESULTS_AVAILABLE_ACTION));
scanWifiList();
btnRefresh.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
scanWifiList();
}
});
}
private void setAdapter() {
adapter = new ListAdapterWifi(getApplicationContext(), wifiList);
lvWifiDetails.setAdapter(adapter);
}
private void scanWifiList() {
mainWifi.startScan();
wifiList = mainWifi.getScanResults();
setAdapter();
}
protected void onResume() {
registerReceiver(receiverWifi, new IntentFilter(WifiManager.SCAN_RESULTS_AVAILABLE_ACTION));
super.onResume();
}
protected void onPause() {
unregisterReceiver(receiverWifi);
super.onPause();
}
class WifiReceiver extends BroadcastReceiver {
public void onReceive(Context c, Intent intent) {
registerReceiver(receiverWifi, new IntentFilter(WifiManager.SCAN_RESULTS_AVAILABLE_ACTION));
}
}
}
的背景颜色，以便您可以看到它实际上位于下方。我找到的唯一解决方法是为.progress提供与其父级相同的border-radius。您可以取消注释.progress-basic，以便内部.progress始终获得父边界半径。